Ask HN: What JS framework/library would you use for lightweight frontend work | Hacker News Reader

Ask HN: What JS framework/library would you use for lightweight frontend work

28 pointsomgmajk36 comments

I am soon starting a project where I am in need of a JavaScript framework to do pretty much only very lightweight frontend work with. I have looked around at things like react, angular, vue, svelte, ember and so on but all of them seem pretty hefty for the purpose. I could use vanilla JS but I am in the mood for testing something new. The other parts of the tech stack are going to be node/express, some css framework like tailwind or bulma and sqlite. Basically to be as "portable" as possible.

Any advice or tips would be greatly appreciated.

View on HN

+1 for Alpine. So awesome and can do a lot for you without the complexity of full frameworks. And no build pipeline to mess with. I’ve used Alpine with Go templates on multiple projects and have been very happy.

Thanks to you as well! It looks pretty promising. :)

Petite-vue (https://github.com/vuejs/petite-vue) is also an alternative to Alpine. It offers a v-scope property similar to x-data so you do most things within markup without having to jump to JS, and it will be easier to move to regular Vue if you ever need something more feature-complete down the road.

This is also pretty interesting, if I ever decide to expand the app. This is pretty much a jungle for me, haha. Thank you!

You can give Mithril.js [0] a go. It's lightweight and has a couple additional goodies such as routing and xhr inbuilt. It has very good documentation as well.

You can also enable JSX [1] if you prefer that to hyperscript.

A site with more code examples and up to date [2]

[0] https://mithril.js.org/

[1] https://mithril.js.org/jsx.html

[2] https://mithril-by-examples.js.org/

Thanks! Mithril looks very promising as well. Gonna play around with it during the weekend. :)

You have already excluded svelte, so maybe you need something more plug and play, but it is lightweight, fast and quick to adopt. It works great even for single dynamic components embedded in static html. But it all depends of on what you need js at all. Since nobody have said it yet, don't forget to look at Solid, it's really a njce gem

I haven't really excluded svelte but looking at it, it seems to be a lot of tooling for the (pretty) minimal work I need to do. However, I was initially debating with myself if svelte or vue would be the right choice. Gonna check solid out, thanks for the suggestion!

Well, yes you'd need a compiler step, usually done with rollup or webpack. If you are aiming for a "no build step" setup you probably have to skip all the jsx libraries too. Vue should still be a good choice, I haven't used vue 3 yet, but at least in vue 2 you could use it right in the browser. Otherwise mithril is cool.

Edit: about solid, the normal "mode" precompiles jsx, but i believe you can use it even without it a la hyperscript

I would indeed prefer to be without such a step. Thanks for the info!

After trying alpinejs for a small frontend-only project (https://spreadsheettimeline.com), I am absolutely sold.

Good constructs, low complexity space, no compilation required.

Tailwind is also excellent.

It does look pretty sweet. Thanks for the extra input!

You might look at Alpine.js.

Or, if you're in the mood for something different, you could also consider native WebComponents. That set of APIs has broad browser support, and can be powerful enough as-is for many applications.

Thanks! This sentence mirrors pretty much everything I was looking for: "Think of it like jQuery for the modern web.". Gonna check it out. :)

Alpine is great and works well with web component libraries, such as Shoelace, which can save you a lot of time.

https://shoelace.style/

I prefer to define front end components as schemas using TypeScript interfaces. I reference elements from event handlers as event.target.

All the composition without any luggage or slowness forced on the user.

If this was a bigger project, something along those lines would have been better most likely. In this case I need to just get it done and end users are not going to look at it as a website, it's more of an app that you install and use yourself in this scenario.

I can't offer you advice, but I am wondering, in the use case of "lightweight", what do we think JS is needed for?

Why not go plain HTML? (with the odd little JS snippet for anywhere it is truly needed)

Mainly because I want to try something new and because I dislike frontend so much that I pretty much need to play with something other than vanilla.

Bulma CSS & vanillaJS/jQuery should be enough for most cases. Fast enough, instant feedback/updates and lightweight.

You'll be saving yourself a lot of time by not googling version compatibility issues or some obscure package bug of the front-end framework itself.

You only need full blown frameworks when you create an application which multiple teams would be working independently on and preferably using CI-CD as the means of deployment, this is absolutely not needed when you're trying to validate a solution or build a one-off project.

Honestly I was debating jQuery but I have used it in the past and was interested in something different. Alpine looks pretty much like what I need but still looking up everything in this post. :)

Chechk this benchmark comparing front-end frameworks (includes alpine, react, vuew, svelte, etc) : https://krausest.github.io/js-framework-benchmark/index.html

Maybe try https://github.com/solidjs/solid

Nice one, sifting through the results will be my night time entertainment. Thank you! Solid looks pretty cool too, I'm eyeing it at the moment.

I started to use htm as a templating language for fastify and express. It's pretty cool as you have familiar JSX-ish syntax in backend templates.

As a next step, I wanna build my own web components and include the tags on the backend. I want to develop frontend apps by controlling them on the backend.

Ficusjs looked interesting.

Gonna check out ficusjs, thanks!

The answer is React, or if by lightweight you mean library size, then use Preact [0] which is 3kB .

[0] https://preactjs.com/guide/v10/differences-to-react

I'm sure, even if I cannot prove it, that React has its use cases. But even if you ignore the library size, it's not lightweight for any definition of the world. Preact is nice, though.

React is a front-end library that isn't particularly 'deep'. It's pretty simple to do simple things. By that definition it's lightweight in my opinion.

I'd pitch in SolidJS on the lightweight part. Overhead is close to zero and the library is ~15Kb I think.

Vanilla JS is best I recommend sticking with that and improving your skills. Everyone thinks they need a framework but Vanilla is powerful if you know what you are doing

Technically you are correct, I never use frameworks for other things. I program mostly in Python, PHP, C and C# - but I am in the mood for using one and I need to rapidly develop this... and quite frankly I don't like to do frontend so it's much more fun this way. The goal is to write as little code as humanly possible.

Stimulus or Alpine for sure.

+1 Stimulus. My team has been using it in a Rails app and it’s a joy to work with. We threw out our React front end and don’t miss it at all.

Stimulus looks pretty cool as well, thanks for pitching it!

What are your project requirements?

My requirements as in what requirements am I writing for my software, or what requirements do I have on the JS framework I'm choosing (speed, blabla)?

Reply on news.ycombinator.com