Zidan
Serving multiple static files to an HTTP request
I have divided my SPA's UI into what I named components, modules and events.
A component is function that returns an HTML element.
A module is function that uses components to build pages, forms, popups Etc.
An event is a function that is called by a component.
All of the above is loaded on demand only, so each module function has an array for component dependencies that are checked for availability (are X, Y, Z already loaded?) before the module attempts to use them. And if they are available, the availability function (which returns a promise) just fulfills. And if one or more of the component dependencies are missing, it runs a
Promise.all() on an array of import() statements to request the component files and their corresponding CSS files one by one, then fulfills or rejects accordingly.
And this is working just fine for now, but I wanted to see if I can request all files at once instead of one by one. So I wanted to try HTTP/2 server push in Deno but then found that its no longer supported.
Then you suggested using the FormData object which would allow me to send a list of files like I wanted to achieve, expect that it involves creating and appending <script> and <link> HTML tags to the DOM for each file, which I would like to avoid.37 replies
Serving multiple static files to an HTTP request
In my novice mind. A user sends a sign in request with their credentials, if successful, I would respond with body like this:
and the files would work without the need to create and append script elements like when done using import.
Instead of responding with just user data + files names so that a pre existing function can import them one by one.
37 replies
Serving multiple static files to an HTTP request
Wow, hack/worth or not, I did not know about any of the approachs you mentioned. Thanks a lot.
Now, I did some reading on FormData and Blobs. And wondering if it's possible to use the JS/CSS files from a FormData Blob without creating/appending script tags like when using import? Or is this the only way for that approach?
37 replies
Serving multiple static files to an HTTP request
Not a performance issue, no. It's about efficiency really. A request and a response per file sounds very wasteful to me. So I wondered if I can send multiple responses per request if the request already has an array of the needed files.
@pyrote mentioned a zip file with all the requested files. So that would be 1 request and 1 response per several files, which sounded pretty good to me 😄.
@guest271314 mentioned a single JSON response with the files. No idea how that works 😕.
37 replies
Serving multiple static files to an HTTP request
My use case:
I'm building an SPA. and have JS files for UI components and their corresponding CSS files. A function that renders a form needs 4 UI components for different field, buttons and so on. The form rendering function checks if those 4 UI components are available before attempting to use them. If not found, it requests them with an import statement one by one, then requests the corresponding CSS files one by one too.
A ZIP file with all the requested files sounds good. But I don't know how to do that. Can you illustrate or link an example?
37 replies
