Skip to content

Performance notes

Turbo is optimized to reduce render‑blocking CSS and improve LCP. These notes explain how it works and what to keep in mind when editing.

Bundled block CSS

All Turbo Blocks CSS is bundled into a single file:

  • blocks.css
  • This reduces multiple render‑blocking requests.

Rebuild after block style edits:

npm run build:blocks-css

Install the theme

wp-content/themes/bbi-turbo

Conditional block styles

Block styles only load when blocks are present on a page.

This keeps non‑block pages lean.

Banner video optimisation

  • Mobile: no YouTube iframe is rendered; only the poster image is shown.
  • Desktop: the iframe is injected only when the banner enters the viewport.

For best results, use a local video, this prevents any render blocking issues from youtube

LCP logo priority

The site logo is marked with:

  • loading=”eager”
  • fetchpriority=”high”
  • decoding=”async”

This helps LCP scores on image‑heavy headers.

Cache awareness

After asset or template changes:

  • Clear caching plugins.
  • Rebuild assets (npm run build).
  • Refresh permalinks if template routing feels broken.