Vertical Sync and Horizontal Tearing


The word 'image' used in this article refers to the full contents of a window. It doesn't refer to the content of a single TOP, as the content of a TOP is only visible when it's drawn to a window.

Horizontal Tearing, also known as Horizontal Shearing, is an artifact visible on computer monitors where there is a horizontal line visible in the image (anywhere in the image), where the top portion is different than the bottom portion. This artifact is caused by data from two different rendered frames being visible at the same time. One portion is the image from the previous frame, while the other portion is the image from the current frame.

This artifact is caused by the monitor displaying the image (i.e., the monitor refreshing) at the same time that the image is getting changed. The solution to this problem is Double Buffering and Vertical Sync, which syncs up the monitor's refresh with when this image gets updated.

The Quick Answeredit

Windows 8 and lateredit

For Windows 8 and later, the desktop should be combined into a single virtual monitor using Mosaic for Nvidia or Eyefinity for AMD. The final output Perform Window should cover the entire desktop to gain exclusive access to the desktop output that avoids tearing and stuttering. To know if this is occuring or not, a screen flicker should occur when the TouchDesigner window goes into focus, and should also occur when it loses focus (such as alt-tabing to another window). This flicker indicates the window is gaining/losing exclusive access to the desktop output.

Double Bufferingedit

Double Buffering is a computer graphics technique used to ensure images displayed on the screen have all the required drawing done to them before they are displayed. Without this technique you would often see windows with only portions of their contents updated. With double buffering the two buffers are called the Front Buffer and the Back Buffer. The Front Buffer is the image that you can currently see on the monitor. The Back Buffer isn't visible, and it's where all of the drawing gets done. When the app wants to update the contents of a window, it draws everything to the back buffer. When all of the drawing is done the app tells the graphics card to swap the buffers (you can see a entry about this in the performance monitor). The back and front buffers are swapped, and you can now see the contents of the back buffer (which has become the front buffer now). All TouchDesigner windows are double buffered.

Vertical Syncedit

Vertical Sync is a feature where the buffer swap that is done when double buffering is done in sync with the monitor's refresh. Without vertical sync the buffer swap can happen in the middle of the monitor's refresh, which will cause a horizontal tear.

Turning off vertical sync will result in higher frame-rates, with the cost of horizontal tearing.

Controlling Vertical Syncedit

You can enable and disable vertical sync in your graphic's driver control panel. By default vertical sync will be on.

Performance Considerationsedit

Frame Rate Limited by Refresh Rateedit

While vertical sync is important for a clean image, it has a performance cost. The first cost is that the frame rate of your content will be limited to the monitor's refresh rate. On most LCDs this is 60 frames per second. Generally this isn't an issue as in most cases the Timeline in TouchDesigner is set to run at 60 frames per second anyway. A big potential performance cost is that your content will only be able to run at a frame rate that divides the refresh rate evenly. That means if your refresh rate is 60, the frame rates you can run at are 60, 30, 20, 15, 10, 6, 5, 4, 3, 2 and 1 fps.

For example, let's say it takes 20ms to do all of the work required to create a frame (CHOPs, SOPs, etc., cooking, GPU rendering to TOPs, GPU rendering to the back buffer, etc.) Now let's start a counter at 0ms, where the monitor refreshes. Then it refreshes again at 16.6ms (since 1000/60 = 16.6). Since it takes 20ms to create your content, the displayed image will be the same as the last one. At the 20ms mark you are finished creating your content, so the app will request a buffer swap. Since vertical sync is enabled, the GPU will need to wait until the 33.3ms mark before it can swap the buffers. So now at the 33.3ms mark it swaps the buffers, and the app starts preparing another frame's content. At the 50ms mark the monitor refreshes again, but again since the content won't be ready until the 53.3ms mark, the displayed image doesn't change. Following from this example, the image on the monitor only changes every 2nd frame, thus the realized frame rate is 30 fps.

There are some more complex things that can happen that may make it possible to get a few more frames outputted to the monitor to realize a higher frame rate, but this is the basic idea.

Multiple Windowsedit

When you have multiple windows drawing at the same time, this can cut your frame rate down significantly. This GPU driver has to sync up multiple buffer swaps with a single monitor, resulting in large slowdowns. For this reason when frame-rate is an issue, place all of your content in a single window. Use the Perform Panel to do this, or open a single large Window COMP with its Perform parameter turned on. This will disable drawing the main TouchDesigner window whenever that Window COMP is opened.

Horizontal Tearingedit

Horizontal Tearing is generally caused by vertical sync being disabled. However there are some other issues with modern graphic's cards that can cause it to happen even if vertical sync is on.

Using Different Model Monitors on the same GPUedit

The GPU can only sync its buffer flip with the monitor refresh of one type of monitor at a time. If you have two different monitors connected to the GPU (even if they are similar), they can have slightly different timings that result in tearing on one of the displays. This is true for Windows 7 and XP.


- The tear usually only happens on the secondary monitor (but this isn't 100% of the time, so test every time you setup your monitors). Either way, once you can determine which monitor is tearing, you can move your important content to the primary monitor.

- Use multiple GPUs in a non-SLI setup. By ensuring that each graphics card has only 1 model of monitor connected to it, the graphics card will be able sync correctly to the monitor(s). You can have 2+ monitors connected to each graphics card as long as each card has only 1 model of monitor connected to it. For more information on this subject refer to the Using Multiple Graphic Cards article.

Some LCDs always tearedit

Some LCDs will always tear due to them not adhering to certain standard specifications. If you have only 1 monitor connected to the graphics card and it's still tearing, this is likely the case.

See Alsoedit

Stuttered Playback