giles
1d83ccba3c
Replace the monolithic 500KB <script data-components> block with a 25KB
JSON manifest mapping names to content hashes. Every definition —
components, islands, macros, client libraries, bytecode modules, and
WASM binaries — is now content-addressed and loaded on demand.
Server (sx_server.ml):
- build_hash_index: Merkle DAG over all definitions — topological sort,
hash leaves first, component refs become @h:{hash} in instantiated form
- /sx/h/{hash} endpoint: serves definitions with Cache-Control: immutable
- Per-page manifest in <script data-sx-manifest> with defs + modules + boot
- Client library .sx files hashed as whole units (tw.sx, tw-layout.sx, etc.)
- .sxbc modules and WASM kernel hashed individually
Browser (sx-platform.js):
- Content-addressed boot: inline script loads kernel + platform by hash
- loadDefinitionByHash: recursive dep resolution with @h: rewriting
- resolveHash: 3-tier cache (memory → localStorage → fetch /sx/h/{hash})
- __resolve-symbol extended for manifest-based component + library loading
- Cache API wrapper intercepts .wasm fetches for offline caching
- Eager pre-loading of plain symbol deps for CEK evaluator compatibility
Shell template (shell.sx):
- Monolithic <script data-components> removed
- data-sx-manifest script with full hash manifest
- Inline bootstrap replaces <script src="...?v="> with CID-based loading
Second visit loads zero bytes from network. Changed content gets a new
hash — only that item refetched (Merkle propagation).
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
82 lines
4.6 KiB
Plaintext
82 lines
4.6 KiB
Plaintext
(defcomp
|
|
~shared:shell/sx-page-shell
|
|
(&key
|
|
(title :as string)
|
|
(meta-html :as string?)
|
|
(csrf :as string)
|
|
(sx-css :as string?)
|
|
(component-hash :as string?)
|
|
(component-defs :as string?)
|
|
(component-manifest :as string?)
|
|
(pages-sx :as string?)
|
|
(page-sx :as string?)
|
|
(body-html :as string?)
|
|
(asset-url :as string)
|
|
(wasm-hash :as string?)
|
|
(platform-hash :as string?)
|
|
(sxbc-hash :as string?)
|
|
(inline-css :as string?)
|
|
(inline-head-js :as string?)
|
|
(init-sx :as string?))
|
|
(<>
|
|
(raw! "<!doctype html>")
|
|
(html
|
|
:lang "en"
|
|
(head
|
|
(meta :charset "utf-8")
|
|
(meta :name "viewport" :content "width=device-width, initial-scale=1")
|
|
(meta :name "robots" :content "index,follow")
|
|
(meta :name "theme-color" :content "#ffffff")
|
|
(title title)
|
|
(when meta-html (raw! meta-html))
|
|
(meta :name "csrf-token" :content csrf)
|
|
(style :id "sx-css" (raw! (or sx-css "")))
|
|
(let
|
|
((cssx-rules (collected "cssx")))
|
|
(clear-collected! "cssx")
|
|
(when
|
|
(not (empty? cssx-rules))
|
|
(style :data-sx-css true (raw! (join "" cssx-rules)))))
|
|
(if
|
|
(not (nil? inline-head-js))
|
|
(when
|
|
(not (empty? inline-head-js))
|
|
(script (raw! inline-head-js)))
|
|
(<>
|
|
(script
|
|
(raw!
|
|
"if(matchMedia('(hover:hover) and (pointer:fine)').matches){document.documentElement.classList.add('hover-capable')}"))
|
|
(script
|
|
(raw!
|
|
"document.addEventListener('click',function(e){var t=e.target.closest('[data-close-details]');if(!t)return;var d=t.closest('details');if(d)d.removeAttribute('open')})"))))
|
|
(if
|
|
(not (nil? inline-css))
|
|
(style (raw! inline-css))
|
|
(style
|
|
(raw!
|
|
"details[data-toggle-group=\"mobile-panels\"]>summary{list-style:none}\ndetails[data-toggle-group=\"mobile-panels\"]>summary::-webkit-details-marker{display:none}\n@media(min-width:768px){.nav-group:focus-within .submenu,.nav-group:hover .submenu{display:block}}\nimg{max-width:100%;height:auto}\n.clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}\n.clamp-3{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}\n.no-scrollbar::-webkit-scrollbar{display:none}.no-scrollbar{-ms-overflow-style:none;scrollbar-width:none}\ndetails.group{overflow:hidden}details.group>summary{list-style:none}details.group>summary::-webkit-details-marker{display:none}\n.sx-indicator{display:none}.sx-request .sx-indicator{display:inline-flex}\n.sx-error .sx-indicator{display:none}.sx-loading .sx-indicator{display:inline-flex}\n.js-wrap.open .js-pop{display:block}.js-wrap.open .js-backdrop{display:block}"))))
|
|
(body
|
|
:class "bg-stone-50 text-stone-900"
|
|
(div :id "sx-root" (raw! (or body-html "")))
|
|
(div :id "portal-root")
|
|
(style
|
|
(raw!
|
|
"[data-sx-island] button,[data-sx-island] a,[data-sx-island] [role=button]{cursor:pointer}"))
|
|
(when
|
|
component-manifest
|
|
(script
|
|
:type "application/json"
|
|
:data-sx-manifest true
|
|
(raw! component-manifest)))
|
|
(when
|
|
init-sx
|
|
(script :type "text/sx" :data-init true (raw! init-sx)))
|
|
(script :type "text/sx-pages" (raw! (or pages-sx "")))
|
|
(script
|
|
:type "text/sx"
|
|
:data-mount "#sx-root"
|
|
(raw! (or page-sx "")))
|
|
(script
|
|
(raw!
|
|
"\n(function(){\n var m=document.querySelector('[data-sx-manifest]');\n if(!m)return;\n var j=JSON.parse(m.textContent);\n\n // Cache API wrapper — intercept .wasm fetches for offline caching.\n if(typeof caches!=='undefined'){\n var _fetch=window.fetch;\n var CACHE='sx-wasm-v1';\n window.fetch=function(input,init){\n var url=(typeof input==='string')?input:\n (input instanceof URL)?input.href:\n (input&&input.url)||'';\n if(url.indexOf('.wasm')!==-1){\n return caches.open(CACHE).then(function(c){\n return c.match(url).then(function(r){\n if(r)return r;\n return _fetch(input,init).then(function(resp){\n if(resp.ok)c.put(url,resp.clone());\n return resp;\n });\n });\n });\n }\n return _fetch(input,init);\n };\n }\n\n // Content-addressed boot: load kernel + platform by hash\n if(!j.boot)return;\n j.boot.forEach(function(h){\n var s=document.createElement('script');\n s.src='/sx/h/'+h;\n document.head.appendChild(s);\n });\n})();\n"))))))
|