Skip to content

This repository demonstrates the several ways to optimise the UI rendering on screen.

Notifications You must be signed in to change notification settings

jitesh-pahalwani/rendering-optimization-techniques

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

rendering-optimization-techniques

This repository aims to demonstrate the several ways to optimise the UI rendering on screen.

The first problem demonstrated here is that of Forced Synchronous Layout (or Layout Thrashing).

When the size of the boxes are changed using the first text input, the sizes increase in an unoptimized way. The Performance Timeline screenshot below shows the FSL caused during the update.

Forced Synchronous Layout Performance Timeline Screenshot

On contrary, when the sizes are changed using the second text input, the sizes increase in an otimized manner, solving the FSL problem. The Performance Timeline shows how fast the rendering becomes.

Forced Synchronous Layout Solution Performance Timeline Screenshot

About

This repository demonstrates the several ways to optimise the UI rendering on screen.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published