---
title: "Load one of each from your own site · Agent Wranglers"
url: https://agentwranglers.se/playbook/website/site-architecture/one-of-each-all-first-party
updated: 2026-10-20
licence: "All rights reserved"
---

# Load one of each from your own site

By Erik Bergstedt, Agent Wranglers. Updated 2026-10-20.

- Level: Recommended
- Chapter: [Site architecture](https://agentwranglers.se/playbook/website/site-architecture)
- Rule: One HTML request, one inline stylesheet, one script bundle, one image per screen size, self-hosted fonts, and no third-party origins.
- How: 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.
- 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.

Example:

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

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

**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`.

- Previous: [Build on HTML that already works](https://agentwranglers.se/playbook/website/site-architecture/progressive-enhancement)
- Next: [Build repeated HTML from shared modules](https://agentwranglers.se/playbook/website/site-architecture/shared-html-modules-only)
- [Site architecture](https://agentwranglers.se/playbook/website/site-architecture)
