Check out my talk about minimum viable view library (then frzr.js.org, now redom.js.org): https://www.youtube.com/watch?v=0nh2EK1xveg
Ask HN: How does one build large front end apps without a framework like React?
11–20 of 197 posts
Re: Ask HN: How does one build large front end apps without a framework like React?
#12IMO, JavaScript frontends have three components:
- Routing
- State
- Rendering
A lot of frameworks try to cover all three of these, and that's where you tend to see a lot of feature churn. I would recommend picking a rendering library (like react) and writing your own routing and state library, even if it's just a light abstraction on top of an existing library. This will make it way easier to upgrade or move in the future, as you will control the API.
Re: Ask HN: How does one build large front end apps without a framework like React?
#13The reasons I avoid large frameworks like React, Angular, Vue, and even jQuery is that they are aren't necessary. They are code decoration that slows things down. Here is what you can expect without these:
* greater flexibility
* faster execution, My current application produces a large single page application that fully renders visually and executes state restoration in about 105ms localhost or under 200ms across a network
* faster maintenance, I can do massive refactors that touch most files in the application in about 2 hours thanks to thorough use of TypeScript interface definitions
---
Here is how I do it:
1. Just start building your application. Realize that for any significant application the front end UI is probably only about 20% of the application code, or less.
2. Start the UI by writing static HTML. Reserve JavaScript, in the browser, only for handling events and state restoration and execute state restoration only on page load.
3. I prefer to use WebSockets over HTTP as much as possible for absolutely everything I can get away with. WebSockets are full-duplex, where HTTP is not, and have far less overhead. That will substantially reduce the complexity around messaging in and out of the web browser.
4. Everything after that is just execution, planning, refactoring, and feature addition.
5. You can do absolutely all of it in TypeScript now without any compile step. Node.js now executes TypeScript directly, but the browser does not. To solve for the web browser just include the browser code into your Node application using ES6 module import. If the imported code is a function you can convert it directly into a string for transport, and otherwise use JSON.stringify for objects/arrays.
Re: Ask HN: How does one build large front end apps without a framework like React?
#14It is not that hard, DOM model is amazing, that's why there are so many frontend frameworks in the first place.
However, you'll inevitably end up with your own after some time. Even if you try your best to stay away from it, you'll need abstractions for:
- components and lifecycle
- some sort of templating
- connecting your app's data and components
Re: Ask HN: How does one build large front end apps without a framework like React?
#15For web, Elixir Phoenix LiveView: https://www.phoenixframework.org/blog/phoenix-liveview-1.0-r...
For platforms, just go native - it's easier than ever with LLM assistance.
Re: Ask HN: How does one build large front end apps without a framework like React?
#16While it does not use a commonly used "framework" it uses many libraries and likely has its own custom framework.
In the past we used http://microjs.com/ and similar to find small libs to work with when we threw together marketing websites, not sure how maintained that list is nowadays but the idea is that you can make websites like lego, sometimes you don't need a whole box of Eiffel tower to make a little tree.
If your functionality is well thought out and not super complicated, don't have 10s or 100s of devs on the same project then working without a well known framework could make sense, otherwise there can be steeper learning curve when onboarding new devs, scope creep / bloat, etc that will likely cause issues down the road.
To learn about this you could try to replicate for example the mentioned Obsidian by yourself and research solutions for all the issues you run into, e.g. minimal routing, custom view renders, reactivity, performance, etc.
Re: Ask HN: How does one build large front end apps without a framework like React?
#17The modern web platform is capable and not bad at all to work with directly. I love seeing projects like HTMX and the recent hyperflask etc showing the way, but you don't need to buy into a project to follow this path, just use the web platform.
Edit: for a more practical example, you don't need to go down the web components rabbithole just for native reactive components, MutationObserver can watch for your template fragments entering and exiting the DOM and run your init/destruct routines on them. Now you can just push HTML back from the server with fetch or xmlhttprequest or whatever, and as soon as your component's HTML enters the DOM it will be "hydrated" by your init routine via MutationObserver. Honestly, add some event signaling and XHR and you're further along to a smooth SPA-like experience than you might think.
Re: Ask HN: How does one build large front end apps without a framework like React?
#18> JS frameworks move really quickly React is a lot more stable than I think you're giving it credit for. > And the stability also means that more time is spent on delivering features Frameworks/libs also exist to save you time, thus letting you spend more time on delivering features. And fwiw, the obsidian team seems to agree in principle. Your link goes to a forum post of some kind, in which one may find a link to o…
> React is a lot more stable than I think you're giving it credit for.
A lot of the HN zeitgegist would have you believe React is the opposite, sadly.
Re: Ask HN: How does one build large front end apps without a framework like React?
#19> JS frameworks move really quickly React is a lot more stable than I think you're giving it credit for. > And the stability also means that more time is spent on delivering features Frameworks/libs also exist to save you time, thus letting you spend more time on delivering features. And fwiw, the obsidian team seems to agree in principle. Your link goes to a forum post of some kind, in which one may find a link to o…
> React is a lot more stable than I think you're giving it credit for.
That's until you have to use it in a real project, for a long time the go to solution was the facebook maintained CRA which is now deprecated. I have spent a lot more time than I'd like to admit migrating webpack versions when it was considered best practises to use class component with decorator but decorator never was standardised in the browser and was never able to get a clean project where running npm install would not give scary warning our project had high vulnerability that was dependencies of dependencies in CRA to the point that it got me wondered that even if the creator of react facebook can't get their shit together, the whole ecosystem is doomed. I have been outside the ecosystem for a year and looking at the shit show that is nextjs it seems things are even worse than before.
Re: Ask HN: How does one build large front end apps without a framework like React?
#20people are oblivious to the fact libraries and frameworks dependencies need to be curated...in other words, theres a tradeoff between time spent managing dependencies and time spent avoiding dependencies...by the way, not upgrading is also an option