Glossary

Image Optimization

Optimize Images

Compress and properly size images to reduce file size without sacrificing quality. Use modern formats like WebP for improved performance.

Defer Offscreen Images

Load images that are not immediately visible (below-the-fold) lazily to improve initial page load times.

Use Efficient Image Formats

Replace older image formats (JPEG, PNG) with newer, more efficient formats like WebP to reduce image size.

Serve Scaled Images

Ensure images are served at the appropriate resolution to avoid unnecessary scaling.

JavaScript Optimization

Eliminate Render-Blocking Resources

Defer or asynchronously load non-critical JavaScript and CSS to allow the page to start rendering faster.

Minify JavaScript

Reduce the size of JavaScript files by removing unnecessary characters like whitespace, comments, and line breaks.

Reduce JavaScript Execution Time

Minimize the amount of JavaScript executed during page load by optimizing or reducing unnecessary scripts.

Defer Unused JavaScript

Delay the loading of JavaScript that is not immediately needed to improve initial load performance.

CSS Optimization

Minify CSS

Compress CSS files by removing whitespace, comments, and unnecessary characters to reduce file size.

Eliminate Unused CSS

Remove or defer CSS that is not being used on the current page to reduce file size and improve loading performance.

Avoid Inline CSS

Move inline CSS to external files and minimize its usage to reduce blocking and improve rendering performance.

Resource Loading Optimization

Preload Key Requests

Preload critical resources, such as fonts or above-the-fold images, to ensure they are fetched earlier and improve rendering performance.

Enable Text Compression (gzip/Brotli)

Compress text-based resources (HTML, CSS, JavaScript) using gzip or Brotli to reduce their transfer size.

Leverage Browser Caching

Set appropriate caching headers for static assets to allow browsers to cache them, reducing the need to fetch resources on subsequent visits.

Reduce Server Response Times (TTFB)

Optimize server configuration and reduce backend processing times to improve Time to First Byte (TTFB).

Use Content Delivery Network (CDN)

Serve assets from a CDN to reduce latency and improve load times, especially for users located far from the server.

Reduce Payload Size (Network Payloads)

Reduce the overall size of the page by optimizing and minimizing resources to decrease download time and improve load performance.

Web Font Optimization

Preload Fonts

Preload web fonts to ensure they are fetched early and reduce the time they block text rendering.

Ensure Text Remains Visible During Web Font Load

Use font-display: swap to ensure text remains visible while web fonts are loading, preventing invisible text.

Use Modern Font Formats

Use modern font formats like WOFF2 to reduce the size of web font files and improve load performance.

Rendering and Layout Optimization

Avoid Large Layout Shifts

Minimize layout shifts caused by dynamically loaded content by reserving space for elements like images and ads.

Reduce Cumulative Layout Shift (CLS)

Prevent unexpected layout changes by predefining sizes for images, ads, and other content that may change the layout after load.

Improve Largest Contentful Paint (LCP)

Ensure the largest visual element (usually an image or text block) loads quickly by optimizing its delivery and loading prioritization.

Reduce Total Blocking Time (TBT)

Reduce long-running tasks that block the main thread, like parsing JavaScript, to improve interactivity.

Improve Time to Interactive (TTI)

Ensure the page is interactive as soon as possible by optimizing scripts and reducing long-running tasks.

Video Optimization

Serve Efficiently Encoded Video

Ensure videos are encoded efficiently to reduce their file size without compromising quality.

Use Video Formats for Animated Content

For animated content, use video formats (e.g., MP4) instead of GIFs, as videos are typically more efficient.

Defer Offscreen Video

Load video elements lazily if they are offscreen to improve initial page load times.

Other Performance Opportunities

Reduce Unused Third-Party Code

Minimize the usage of third-party scripts that are not essential, as they can negatively impact performance.

Remove Redundant or Unnecessary HTTP Requests

Reduce the number of HTTP requests by combining resources, deferring non-critical resources, or removing redundant files.

Ensure Proper Cache Policy for Dynamic Content

Ensure that dynamic content (like API responses) is cached appropriately to reduce server requests and improve speed.

Avoid Redirects

Minimize the number of redirects to improve the user experience and reduce page load times.

Use HTTP/2 for Faster Resource Loading

Ensure that the website uses HTTP/2, which allows multiplexing, reducing the number of connections required to load resources.

Reduce Unused Network Requests

Ensure that unnecessary resources (like images, scripts, or fonts) are not being requested and loaded by the browser.

Avoid Excessive DOM Size

Keep the Document Object Model (DOM) small and manageable to avoid performance bottlenecks and long-running tasks.