Web Development Performance Optimization 3

Question 1

Which CSS property enables hardware-accelerated animations by offloading to the GPU compositor?

Accepted Answer

will-change: transform

Answer

will-change: transform hints the browser to promote the element to its own compositor layer, enabling GPU acceleration.

Question 2

What is the purpose of the 'defer' attribute on a <script> tag?

Accepted Answer

It downloads the script in parallel and executes it after HTML parsing completes

Answer

defer downloads the script without blocking parsing and executes it in order after the document is fully parsed.

Question 3

What does the Lighthouse 'Time to Interactive' (TTI) metric measure?

Accepted Answer

When the page is fully interactive and reliably responds to user input

Answer

TTI measures when the main thread is quiet for at least 5 seconds and the page can reliably respond to user input.

Question 4

Which approach best reduces the impact of third-party scripts on page performance?

Accepted Answer

Loading third-party scripts with the 'async' attribute or deferring them

Answer

Using async or defer for third-party scripts prevents them from blocking the main thread during page load.

Question 5

What is 'lazy loading' in the context of images?

Accepted Answer

Loading images only when they enter (or approach) the viewport

Answer

Lazy loading defers loading off-screen images until the user scrolls near them, reducing initial page load time.

Web Development Practice Test