Live data from Hacker News

Modern SPAs without bundlers, CDNs, or Node.js

kofi.sexy

41–50 of 170 posts

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

#41

To go quite a bit off topic. The author says that he starts with a single html file and splits it or incrementally adds stuff when needed. That course of action has proven to be a really bad idea on every non trivial web project I worked on. Mostly for teamwork and maintainability reasons. E.g there is no clear project structure, the next dev will not understand stuff and do things differently. And welcome to the cha…

As someone who does this too: it depends. If you take time out every now and then to completely refactor your code base it can actually be surprisingly effective. I've done exactly that on my last project and I'm pretty happy with the end result, you can have a look for yourself: https://gitlab.com/jmattheij/pianojacq/-/tree/master/js This project will likely never be finished, there are always nice new things to add…

I looked through your code a bit, and there are a couple of things I'd flag in a code review (e.g. use of non-local variables). Ironically these are things that are a lot harder to do, and easier to spot, if proper modules are used.

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

#42

Earlier quoted context omitted.

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.

I just don’t get the whole adding another DSL instead of using JSX or something.

JSX suffers from the same problem that early PHP did. Because you have the full power of JS at your hands, you need some very good linting rules if you don't want to end up with a mess combining presentation and functionality. By having a hard split between the two you're forced to build declarative templates.

Most React projects I've jumped into are really hard to understand regarding which template elements come from which pieces of code (partly due to JSX, partly due to design patterns which seem counter-productive). I've never had this issue with a Vue project.

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

#43
post #35

I appreciate the principled avoidance of over-tooling and dependencies. importmap is neat! edit: In the same vein; cross-linking to "Writing JavaScript without a build system (jvns.ca)" https://news.ycombinator.com/item?id=34825676

Yeah, two really similar posts in a short time

This has been happening on HN a lot nowadays.

Tons of instances where there there are two closely related posts on the front page at the same time. Wonder if one post is inspired by the other, or they are usually independent.

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

#44
post #41

Earlier quoted context omitted.

As someone who does this too: it depends. If you take time out every now and then to completely refactor your code base it can actually be surprisingly effective. I've done exactly that on my last project and I'm pretty happy with the end result, you can have a look for yourself: https://gitlab.com/jmattheij/pianojacq/-/tree/master/js This project will likely never be finished, there are always nice new things to add…

I looked through your code a bit, and there are a couple of things I'd flag in a code review (e.g. use of non-local variables). Ironically these are things that are a lot harder to do, and easier to spot, if proper modules are used.

I'm sure you would, and if you looked at earlier versions of that same code you'd see mountains more of those.

I'd love for everything to be perfectly pure though and side effect free. The pressure is always on to improve it further. As for code review, feel free and open tickets for whatever you spot and hopefully one day I'll get around to it. Better yet: submit pull requests.

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

#46

To go quite a bit off topic. The author says that he starts with a single html file and splits it or incrementally adds stuff when needed. That course of action has proven to be a really bad idea on every non trivial web project I worked on. Mostly for teamwork and maintainability reasons. E.g there is no clear project structure, the next dev will not understand stuff and do things differently. And welcome to the cha…

As someone who does this too: it depends. If you take time out every now and then to completely refactor your code base it can actually be surprisingly effective. I've done exactly that on my last project and I'm pretty happy with the end result, you can have a look for yourself: https://gitlab.com/jmattheij/pianojacq/-/tree/master/js This project will likely never be finished, there are always nice new things to add…

> If you take time out every now and then to completely refactor your code base it can actually be surprisingly effective.

So much this!

Current project I'm on, I own the entire front end for a major modernisation (AKA rewrite) of a legacy application and we are working in 4 week "sprints". I'm giving myself two days every month just to refactor the code I wrote that month.

How you plan to structure a project never works out, you always find better ways as you go and as the objective and priorities change (they always do).

On another tangent, before pivoting into software development I used to be a mechanical/industrial engineer. The parallels between coding and CAD are enormous. With CAD you also need to be spending 10% of your time "refactoring" your model. It's almost exactly the same from a maintainability perspective and leaving the model with good hygiene for the next person to work on.

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

#47

Earlier quoted context omitted.

As someone who does this too: it depends. If you take time out every now and then to completely refactor your code base it can actually be surprisingly effective. I've done exactly that on my last project and I'm pretty happy with the end result, you can have a look for yourself: https://gitlab.com/jmattheij/pianojacq/-/tree/master/js This project will likely never be finished, there are always nice new things to add…

> If you take time out every now and then to completely refactor your code base it can actually be surprisingly effective. So much this! Current project I'm on, I own the entire front end for a major modernisation (AKA rewrite) of a legacy application and we are working in 4 week "sprints". I'm giving myself two days every month just to refactor the code I wrote that month. How you plan to structure a project never w…

> How you plan to structure a project never works out, you always find better ways as you go and as the objective and priorities change (they always do).

I always joke I write everything three times. The first time to get a feel for the space, the second time because I think I now understand it and then again when I finally really understand it. Most of the times these three look absolutely nothing like each other.

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

#49
post #42

Earlier quoted context omitted.

I just don’t get the whole adding another DSL instead of using JSX or something.

JSX suffers from the same problem that early PHP did. Because you have the full power of JS at your hands, you need some very good linting rules if you don't want to end up with a mess combining presentation and functionality. By having a hard split between the two you're forced to build declarative templates. Most React projects I've jumped into are really hard to understand regarding which template elements come fr…

JSX is quite a bit better than early PHP, but yeah, it has the same issue. I like both JSX and Vue templates, though (I prefer JSX with Vue or Preact).

I think JSX and Vue templates both are discovered, not invented, and have staying power because of that. JSX is neat because it is a really simple hybrid of two languages and is fully composable. Vue templates are neat because unlike so many other HTML templating languages, the templating is inside (X)HTML attributes, and they don't go too nuts with them like Angular did. It took time for Vue to support pretty much everything, but now it does. The nested tag can be used to accomplish the same things as JSX fragments. The IDE tooling adds syntax highlighting and autocomplete to the JavaScript expressions. Even though it's HTML5, Vue went ahead and supported XML-style self-closing tags.

Post reply on HN