Skip to main content

inlined-asset-links.html

The inlined-asset-links.html include file defines deferred loading for the main non-critical stylesheet and JavaScript bundle.

Pathinclude/inlined-asset-links.html
LanguageHTML
Lines2

Read this when Use this page when tracing the HTML/Pandoc templates and include fragments that shape rendered gwern.net pages around inlined-asset-links.

Overview​

The inlined-asset-links.html include file provides versioned links to the main stylesheet and JavaScript bundle. It is included at the top of <body> (after the critical inlined <head> resources), so the main stylesheet does not delay the initial <head> parse and the script is deferred.

This file is GENERATED: build/build_body_includes.php (run from the git pre-commit hook, build/pre-commit.hook.php) rewrites the asset links with current version query strings. Do not edit it by hand.

Content Structure​

<link rel="stylesheet" href="/static/css/style.css?v=...">
<script src="/static/js/script.js?v=..." defer></script>

Loading Strategy​

Stylesheet:

  • A plain <link rel="stylesheet"> (no media="print"/onload trick), placed at the start of <body> rather than in <head>.
  • Critical styling is already provided by the inlined styles in inlined-head.html, so the full style.css can load after first paint of the head-styled content.

Script:

  • Uses defer so download happens in parallel with HTML parsing.
  • Executes after DOM parsing and before DOMContentLoaded.
  • Preserves execution order relative to other deferred scripts.

Cache-Busting​

The ?v= query string is a version timestamp (generated by VersionedAssetHref() in the PHP build scripts) to force cache refreshes when the bundle changes.

Integration​

Actual SSI placement (from template/default.html; the directive is processed by nginx's SSI module at serve time):

<body class="$page-body-classes$">
  <!-- SSI: Inlined asset links -->
  <!--#include virtual="/static/include/inlined-asset-links.html" -->
  <!-- page content -->
</body>
See Also