riki/treehouse
riki/treehouse
1
Fork 0
Code Issues 33 Activity

add site-wide JS caching through import maps

Browse source
This commit is contained in:
りき萌 2024-07-19 20:05:17 +02:00
parent f3aee8f41a
commit 10ccb250c1
15 changed files with 169 additions and 48 deletions
Download patch file Download diff file Expand all files Collapse all files

26
template/components/_head.hbs
View file

@ -9,24 +9,24 @@
<link rel="stylesheet" href="{{ asset 'css/main.css' }}">
<link rel="stylesheet" href="{{ asset 'css/tree.css' }}">
<script type="importmap">{
"imports": {
"treehouse/": "{{ config.site }}/static/js/"
}
}</script>
{{!-- Import maps currently don't support the src="" attribute. Unless we come up with something
clever to do while browser vendors figure that out, we'll just have to do a cache-busting include_static. --}}
{{!-- <script type="importmap" src="{{ asset 'generated/import-map.json' }}"></script> --}}
<script type="importmap">{{{ include_static 'generated/import-map.json' }}}</script>
<script>
const TREEHOUSE_SITE = `{{ config.site }}`;
const TREEHOUSE_NEWS_COUNT = {{ len feeds.news.branches }};
</script>
<script type="module" src="{{ config.site }}/navmap.js"></script>
<script type="module" src="{{ config.site }}/static/js/spells.js"></script>
<script type="module" src="{{ config.site }}/static/js/ulid.js"></script>
<script type="module" src="{{ config.site }}/static/js/usability.js"></script>
<script type="module" src="{{ config.site }}/static/js/settings.js"></script>
<script type="module" src="{{ config.site }}/static/js/tree.js"></script>
<script type="module" src="{{ config.site }}/static/js/emoji.js"></script>
<script type="module" src="{{ config.site }}/static/js/news.js"></script>
<script type="module">
import "treehouse/spells.js";
import "treehouse/ulid.js";
import "treehouse/usability.js";
import "treehouse/settings.js";
import "treehouse/tree.js";
import "treehouse/emoji.js";
import "treehouse/news.js";
</script>
<meta property="og:site_name" content="{{ config.user.title }}">
<meta property="og:title" content="{{ page.title }}">

11
template/components/_tree.hbs
View file

@ -4,12 +4,15 @@
extracting them way more painful than it needs to be. --}}
{{#each page.styles}}
<link rel="stylesheet" href="{{ ../config.site }}/static/css/{{ this }}">
<link rel="stylesheet" href="{{ asset (cat 'css/' this) }}">
{{/each}}
{{#each page.scripts}}
<script type="module" src="{{ ../config.site }}/static/js/{{ this }}"></script>
{{/each}}
<script type="module">
{{!-- Go through the import map for each script. --}}
{{#each page.scripts}}
import "{{ this }}";
{{/each}}
</script>
{{{ page.tree }}}
</main>

9
template/sandbox.hbs
View file

@ -5,7 +5,7 @@
<head>
<title>treehouse iframe sandbox</title>
<link rel="stylesheet" href="{{ config.site }}/static/css/main.css">
<link rel="stylesheet" href="{{ asset 'css/main.css' }}">
<style>
body {
@ -21,12 +21,7 @@
}
</style>
<script type="importmap">{
"imports": {
"treehouse/": "{{ config.site }}/static/js/",
"tairu/": "{{ config.site }}/static/js/components/tairu/"
}
}</script>
<script type="importmap">{{{ include_static 'generated/import-map.json' }}}</script>
<script type="module">
import { evaluate, domConsole, jsConsole } from "treehouse/components/literate-programming/eval.js";