seed the client cache

.vscode/launch.json

@@ -0,0 +1,24 @@
+{
+    // Use IntelliSense to learn about possible attributes.
+    // Hover to view descriptions of existing attributes.
+    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+    "version": "0.2.0",
+    "configurations": [
+        {
+            "request": "launch",
+            "name": "Launch Program",
+            "type": "node",
+            "program": "${workspaceFolder}/server.tsx",
+            "cwd": "${workspaceFolder}",
+            "runtimeExecutable": "C:\\Users\\Seth\\.deno\\bin\\deno.EXE",
+            "runtimeArgs": [
+                "run",
+                "--no-lock",
+                "--unstable",
+                "--inspect-wait",
+                "--allow-all"
+            ],
+            "attachSimplePort": 9229
+        }
+    ]
+}

fetch.test.tsx

@@ -10,13 +10,13 @@ const delay =async(inHandler:()=>void, inDelay:number):Promise<void>=>
     });
 };
 
-const cacheRecord = {Promise:delay(()=>{}, 1000)};
-
-cacheRecord.Promise.then(()=>{console.log(`handler one`)});
-cacheRecord.Promise.then(()=>{console.log(`handler two`)});
-
-cacheRecord.Promise = delay(()=>{}, 3000);
+const queue = [1, 2, 3];
+while(queue.length)
+{
+    await(delay(()=>{console.log(queue.pop())}, 1000))
+}
 
+console.log("all done!");
 
 /*
 let r1, r2, r3;

lib/iso.tsx

@@ -160,10 +160,19 @@ export const Switch =({children}:{children:Children})=>
 export const Case =({children, value}:{children:Children, value?:string, default?:true})=>null;
 export const useRouteVars =()=> React.useContext(SwitchContext).keys;
 
-type FetchRecord = {URL:string, CacheFor:number, CachedAt:number, Promise?:Promise<FetchRecord>, DelaySSR:boolean, Error?:string, JSON?:object};
+export type FetchRecord = {URL:string, CacheFor:number, CachedAt:number, CacheOnServer:boolean, Promise?:Promise<FetchRecord>, DelaySSR:boolean, Error?:string, JSON?:object};
 export const Fetch = {
     Cache:new Map() as Map<string, FetchRecord>,
-    Request(URL:string, Init?:RequestInit, CacheFor:number = 60, DelaySSR:boolean = true)
+    ServerBlocking:false as false|Promise<FetchRecord>[],
+    ServerTouched:new Set() as Set<FetchRecord>,
+    Seed(seed:FetchRecord[])
+    {
+        seed.forEach(r=>{
+            r.Promise = Promise.resolve(r);
+            Fetch.Cache.set(r.URL, r)
+        });
+    },
+    Request(URL:string, Init?:RequestInit, CacheFor:number = 60, CacheOnServer:boolean = true, DelaySSR:boolean = true)
     {
         let check = Fetch.Cache.get(URL);
         
@@ -183,7 +192,7 @@ export const Fetch = {
         if(!check)
         {
             console.log(`making new cache record...`);
-            return load({URL, CacheFor, CachedAt:0, DelaySSR});
+            return load({URL, CacheFor, CachedAt:0, CacheOnServer, DelaySSR});
         }
         else if(check.CachedAt == 0)
         {
@@ -207,23 +216,30 @@ export const Fetch = {
 
         }
     },
-    Use(URL:string, Init?:RequestInit, CacheFor:number = 60, DelaySSR:boolean = true)
+    Use(URL:string, Init?:RequestInit, CacheFor:number = 60, CacheOnServer:boolean = true, DelaySSR:boolean = true)
     {
         type FetchHookState = [Data:undefined|object, Updating:boolean];
         const [cacheGet, cacheSet] = React.useState([undefined, true] as FetchHookState);
+        if(Fetch.ServerBlocking && DelaySSR)
+        {
+            const receipt = Fetch.Request(URL, Init, CacheFor, CacheOnServer, DelaySSR);
+            if(receipt.CachedAt === 0 && receipt.Promise)
+            {
+                Fetch.ServerBlocking.push(receipt.Promise);
+            }
+            else
+            {
+                Fetch.ServerTouched.add(receipt);
+            }
+            return [receipt.JSON, receipt.CachedAt === 0];
+        }
         React.useEffect(()=>
         {
-            const receipt = Fetch.Request(URL, Init, CacheFor, DelaySSR);
-            receipt.Promise?.then(()=>{
-                ++count;
-                if(count > 10){return;}
-                console.log(`updating state`, receipt);
-                cacheSet([receipt.JSON, receipt.CachedAt === 0]);
-            });
+            const receipt = Fetch.Request(URL, Init, CacheFor, CacheOnServer, DelaySSR);
+            receipt.Promise?.then(()=>cacheSet([receipt.JSON, receipt.CachedAt === 0]));
         }
         , []);
 
         return cacheGet;
     }
-};
-let count = 0;
+};

server.tsx

@@ -221,10 +221,29 @@ FileListen("${url.pathname}", reloadHandler);`;
         }
         else
         {
-            const results = Twind.extract(SSR(<Iso.Router.Provider url={url}><App/></Iso.Router.Provider>), TwindInst);
+            Iso.Fetch.ServerBlocking = [];
+            let bake = SSR(<Iso.Router.Provider url={url}><App/></Iso.Router.Provider>);
+            while(Iso.Fetch.ServerBlocking.length)
+            {
+                await Promise.all(Iso.Fetch.ServerBlocking);
+                Iso.Fetch.ServerBlocking = [];
+                bake = SSR(<Iso.Router.Provider url={url}><App/></Iso.Router.Provider>);
+            }
+
+            const seed:Iso.FetchRecord[] = [];
+            Iso.Fetch.ServerTouched.forEach((record)=>{
+
+                const r:Iso.FetchRecord = {...record};
+                delete r.Promise;
+                seed.push(r);
+            });
+            Iso.Fetch.ServerTouched = new Set();
+
+            const results = Twind.extract(bake, TwindInst);
 
             type = `text/html`;
-            body = `<!doctype html>
+            body =
+`<!doctype html>
 <html lang="en">
     <head>
         <title>${Iso.Meta.title}</title>
@@ -239,8 +258,9 @@ FileListen("${url.pathname}", reloadHandler);`;
             import {render, createElement as H} from "react";
             import * as Twind from "https://esm.sh/v115/@twind/core@1.1.3/es2022/core.mjs";
             import {default as App, CSS} from "@eno/app";
-            import {Router} from "@eno/iso";
+            import {Router, Fetch} from "@eno/iso";
             Twind.install(CSS);
+            Fetch.Seed(${JSON.stringify(seed)});
             render( H(Router.Provider, null, H(App)), document.querySelector("#app"));
         </script>
     </body>