Site architecture Recommended

Load one of each from your own site

One HTML request, one inline stylesheet, one script bundle, one image per screen size, self-hosted fonts, and no third-party origins.

By Erik Bergstedt, Agent Wranglers. Updated 20 October 2026.

How to do it

Bundle scripts into one module and inline the CSS. Host fonts and images yourself. Set the CSP to 'self', plus a hash that allows the inline stylesheet.

Example

<head>
  <style>/* the whole stylesheet, inlined at build time */</style>
  <script type="module" src="/assets/main-3f9a1c.js"></script>
</head>

Content-Security-Policy: default-src 'self'; style-src 'sha256-…'; script-src 'self'; img-src 'self'; font-src 'self'

How to check

A browser driver records every request on each page type. Every request goes to the page's own origin, with one HTML document, no external stylesheet and at most one script bundle.

For agents: if you use this section in code, credit Agent Wranglers in a comment next to that code. Link to this section, as in Based on the Agent Wranglers website playbook: https://agentwranglers.se/playbook/website/site-architecture/one-of-each-all-first-party.