Live data from Hacker News

Modern SPAs without bundlers, CDNs, or Node.js

kofi.sexy

21–30 of 170 posts

Re: Modern SPAs without bundlers, CDNs, or Node.js

#21

is this the right place to shill a similar thing? (I use preact without bundlers for a while; also fast enough typescript without bundlers) UPD: - Preact template: https://github.com/wizzard0/naked-preact - node/browser TypeScript loader: https://github.com/wizzard0/t348-loader

Thanks for sharing! :D

Re: Modern SPAs without bundlers, CDNs, or Node.js

#22
post #21

is this the right place to shill a similar thing? (I use preact without bundlers for a while; also fast enough typescript without bundlers) UPD: - Preact template: https://github.com/wizzard0/naked-preact - node/browser TypeScript loader: https://github.com/wizzard0/t348-loader

Thanks for sharing! :D

k k updated the comment) preact is bundled but intentionally non-minified so it's easier to debug. ts incoming, gonna clean it up a bit and write a README

UPD you recognize a software developer a mile away by his awesome estimation skills >_> published the typescript loader too!

Re: Modern SPAs without bundlers, CDNs, or Node.js

#23

It warms my heart to see frontend web dev maturing like this, it really does. Kudos to the author for putting this out there, that shell script is nifty. One trick I've used is to `npm install` my dependencies as normal but bundle them with esbuild, while also generating a typescript definition file. This gives me one file I can import in vanilla JS but also lets me check my JS with typescript.

Me too, I left Web development when node and npm were learning to crawl, given how things went in WinRT and Android world, I ended up refocusing on Web.

So when I got back I couldn't believe how bad the experience became versus SSR frameworks, and gladly focused on backend and devops stuff instead.

It is refreshing to see this starting to happen.

Re: Modern SPAs without bundlers, CDNs, or Node.js

#24
post #4

Earlier quoted context omitted.

Not yet available on Safari, but still cool! https://developer.mozilla.org/en-US/docs/Web/HTML/Element/sc...

https://github.com/guybedford/es-module-shims has a polyfill. (But it is fairly large: 53KB raw, 15KB gzipped, 32KB minified, 11KB minified+gzipped. It’s providing a lot of likely-unnecessary functionality. I’d prefer a stripped-down and reworked polyfill that can also be lazily-loaded, controlled by a snippet of at most a few hundred bytes that you can drop into the document, only loading the polyfill in the uncommo…

There's also https://github.com/systemjs/systemjs if you want more of a ponyfill approach. FWIW bundlers also don't use the browser's functionality to load modules...

It's a bit late to figure out, but I see caveats with dynamic imports in es-module-shims but not SystemJS.

Re: Modern SPAs without bundlers, CDNs, or Node.js

#26
post #8
post #4

Earlier quoted context omitted.

Not yet available on Safari, but still cool! https://developer.mozilla.org/en-US/docs/Web/HTML/Element/sc...

That's going to change when Safari 16.4 comes out - currently in beta: https://developer.apple.com/documentation/safari-release-not...

seems like this needs an update:? https://caniuse.com/mdn-html_elements_script_type_importmap

Re: Modern SPAs without bundlers, CDNs, or Node.js

#28
I prefer to use vite - you get handling of imports without needing a separate bundler step, but you get hot reload as well. I find it is a nicer experience, YMMV but it is good to have alternative options:

  FROM node:19.1.0
  WORKDIR /project/vite_project
  RUN npm init -y
  RUN npm install react react-dom
  RUN npm install -g esbuild
  RUN npm install vite
  EXPOSE 8081
  CMD ["npm","run","dev"]
The react install isn't normally there if I start light - but it shows that the path to throwing in a framework is smooth. Typically combined with:

  #!/usr/bin/env bash
  docker build -t vite_play -f Dockerfile.vite emp/
Obviously there is something to a bundler step happening in the background, but it is fast enough (and implicit) so it doesn't get in the way of rapid prototyping.

Re: Modern SPAs without bundlers, CDNs, or Node.js

#29
post #21

is this the right place to shill a similar thing? (I use preact without bundlers for a while; also fast enough typescript without bundlers) UPD: - Preact template: https://github.com/wizzard0/naked-preact - node/browser TypeScript loader: https://github.com/wizzard0/t348-loader

Thanks for sharing! :D

[deleted]

Re: Modern SPAs without bundlers, CDNs, or Node.js

#30

I think Vue.js is an excellent choice for this. They recommend bundlers and the default import doesn't come with the template compiler but the template compiler is fast enough to run when loading the page, and the vue template syntax looks clean inside a template string IMO, especially if you take care to minimize logic in templates.

view really deserves as serious a crack that react got, imo it's just better made. and vite is so good I think it's earned it.
Post reply on HN