This module customises Silverstripe's requirements backend to defer CSS loading using the preload pattern.
It overrides includeInHTML() and rewrites stylesheet links to:
<link rel="preload" as="style" href="..." onload="this.onload=null;this.rel='stylesheet'">This helps reduce initial render-blocking caused by CSS files while still applying styles once each file has loaded.
- Replaces the default
SilverStripe\View\Requirements_Backendvia Injector. - Overrides
includeInHTML()inToast\Injectors\ToastEnhancedBackend. - Keeps JavaScript and custom head tags injection behavior aligned with the parent backend flow.
- Converts CSS requirements to
rel="preload"links with anonloadswitch torel="stylesheet".
Configured in _config/config.yml:
SilverStripe\Core\Injector\Injector:
SilverStripe\View\Requirements_Backend:
class: Toast\Injectors\ToastEnhancedBackendcomposer require toastnz/deferred-cssThen flush configuration:
vendor/bin/sake dev/build flush=allIn ToastEnhancedBackend::includeInHTML():
- Checks if
</head>exists and there are requirements to inject. - Runs
processCombinedFiles()to preserve combined assets behavior. - Outputs JavaScript includes and inline custom scripts.
- Rewrites CSS includes as preload links with
as="style"andonloadrel swap. - Injects CSS/head tags into
<head>and scripts according to Silverstripe settings.
- This module targets Silverstripe Framework 6.
onload-based deferred CSS is widely used, but always test critical rendering paths in your project.- Validate frontend behavior in older browsers used by your audience.
BSD-3-Clause. See LICENSE.