Live data from Hacker News

None of my projects want to be SPAs

whatisjasongoldstein.com

271–280 of 362 posts

Re: None of my projects want to be SPAs

#271

This may be a mean thing to say, but basically I think SPA's are massively overused, because developers want to demonstrate that they can do them. Why? Because big companies like Facebook and Google use them. Why? Because they actually are doing things that require them. 99% of the SPAs in production are things that should have been done the old Rails/Django/Laravel way, but that would not set you up as a developer w…

Not to completely disagree, but I've worked mostly with web based applications, not specifically static content (with few exceptions)... I find working with React and similar far easier for mid-large applications than most of what came before. I was optimistic around ASP.Net (webforms not mvc) and in practice it was a bloated mess without doing a lot of goofy things. If you're building web applications, it's usually…

In my experience SPAs are actually much more prone to bloat and the resultant performance issues. If you have thousands of components you definitely need to dive into all the complexity of code splitting and server side rendering to make your app fast. You can very quickly find that you have a 4MB JS download.

Of course each application has different needs, but for large multi-developer UIs, I think a better option is to split your front end into distinct server based pages where you leverage React/GraphQL/SPA/PWA features for great DX within those pages. That way you can keep it fast and potentially limit some of the complexity.

Re: None of my projects want to be SPAs

#272

Back when I was doing React, what pulled me in was that it WASN'T a framework for SPAs. What I got from it was the ability to build UI widgets (components, in React terms) that worked within a page, and were composable with other UI widgets. With that approach, you really wanted to keep every component self-contained. That meant a lot of bookkeeping with passing events back and forth between parent and child widgets,…

> These frameworks add a huge amount of hidden global complexity just to avoid having to pass parameters to components, which is the simplest thing to do. Redux offers a few benefits: 1. Allows you to keep your global application state 100% predictable by treating it as a pure function of an event stream (dispatched actions). This makes it trivial to test. 2. Allows you to "time travel" the state of your store using…

As an addendum to #3, it's a single state that is passed down as a global/app state. If you break it up with the context api, it can get messy quickly.

As to other comments about logic in the View or State, it's bound to happen... the two aren't actually divisive concerns. Personally, I'm happier to use Redux than seeing prop drilling everywhere.

Re: None of my projects want to be SPAs

#273
To contrast, I've been looking for a reason to use Go for a couple years now on an actual project, I haven't really found one yet. That doesn't mean that go doesn't serve a purpose and is probably more representative of me being adverse to taking on the risk of learning/using it with a project than it does as to the ability of Go to serve a specific role.

Re: None of my projects want to be SPAs

#274

Earlier quoted context omitted.

Because I decided I like React? :P From my perspective, React is the thing with the problem: it doesn't have great state management for complex tasks / multi-component coordination. What I want to use is something like RxJS to manage such interactions and state, because it gives me a lot of power/control in a relatively easy way. One of the best options out there that I've seen is redux-observable, and thus Redux its…

Have you tried MobX? If yes - could you share your criticism? I liked it more than redux, because you can have have simple class implementation and side effects without much hassle. Also TS support and testing is easy.

I have not tried MobX. It smells a bit too much like Aurelia, and I've been burnt a bit by Aurelia. More generally, too, things that make heavy use of ES2015 Proxies for side effects tend to make me pause, simply by nature of black/gray boxing those side effects, and also making it a little harder to control/throttle them in cases where performance matters more than "magic".

(Which is an interesting turn of events, personally, because I really liked Knockout ages ago, but its attempted successors in MobX, Aurelia, and even Vue leave me cold. I think partly because Knockout was so much more verbose and forced/needed a clearer "MVVM" separation simply by how "dumb" it was, whereas Proxies and Descriptors gives too much of an illusion that you are working with "plain" objects that don't need a clear "MVVM" separation until it is sometimes too late to fix a maintainability/tech debt hole.)

Re: None of my projects want to be SPAs

#275
post #240

Earlier quoted context omitted.

>exists only once and is needed in many parts. I think many people could argue that this concept itself is a bit misguided. There are plenty of application patterns and architectures that help you move stateful data around your app and translate it for the components who need to consume it or change it, while hiding it from components in the tree which do not interact with or care about the state. If you have many di…

Redux state isn't mutable. Mutating the state tree in a redux reducer is a bug.

Okay, technically it's copy on write, but I think if you put a bit of effort into understanding what people mean, you're smart enough to understand what the parent comment meant. Let's avoid making this holy war into a semantic argument. :)

Re: None of my projects want to be SPAs

#276
post #271

Earlier quoted context omitted.

Not to completely disagree, but I've worked mostly with web based applications, not specifically static content (with few exceptions)... I find working with React and similar far easier for mid-large applications than most of what came before. I was optimistic around ASP.Net (webforms not mvc) and in practice it was a bloated mess without doing a lot of goofy things. If you're building web applications, it's usually…

In my experience SPAs are actually much more prone to bloat and the resultant performance issues. If you have thousands of components you definitely need to dive into all the complexity of code splitting and server side rendering to make your app fast. You can very quickly find that you have a 4MB JS download. Of course each application has different needs, but for large multi-developer UIs, I think a better option i…

I'm on a moderately complex UI right now, that has a JS payload around 364kb gzipped, react-dom, chart.js and material-ui/core bits accounting for most of the heavy bits. I've also been heavy handed with pulling out libraries that could be done easy enough with just React and JS. Svg is suprisingly easy in React, and a couple events while tricky aren't as bad as some other tooling I've used in the past.

Overall it loads in right around 1s, as I mentioned the splitting for async load on demand doesn't work at the moment, which I had the initial load for a page not using chart.js down to around 115kb gzipped. Part of that also includes the embedded SVG icons as well as the JSS for styling.

It's not paying attention when lodash + underscore, + rambda + momentjs, etc. all get loaded via dependencies... most of that can expressly be avoided with specific smaller frameworks and tooling.

https://i.imgur.com/gf5cpNd.png

Re: None of my projects want to be SPAs

#277
post #214

Earlier quoted context omitted.

But... people had dynamic UIs before jQuery and Vue. The main benefit of jQuery was back in the days when the browsers were so different from each other, but that's not the case anymore. I'd recommend learning some vanilla JS before thinking that you need jQuery/Vue/React to create dynamic UIs.

The difference is imperative vs reactive UI. The impact of this is hard to overstate.

[deleted]

Re: None of my projects want to be SPAs

#278
post #233

Earlier quoted context omitted.

The problem that you end up with past a certain scale in a component-based app without a state management framework (third party or your own) is that you're performing business logic inside view components. By moving your business logic into your state management framework and using something like redux-saga that is designed specifically for managing complex asynchronous workflows, you can extract your application co…

> The problem that you end up with past a certain scale in a component-based app without a state management framework (third party or your own) is that you're performing business logic inside view components. I respectfully disagree here. All UI views in React can be controlled via parameters. Very few components in a React application require state management. You can add parameter functions to handle various events…

> Very few components in a React application require state management.

I agree. My apps usually consist of a few stateful components for dropdowns and modals and such with the remaining being functional components. The problem is the majority of "legacy" react apps I've come across seem to have the opposite ratio (I personally think this is because most react tutorials are written for fresh out of bootcamp developers by slightly more experienced fresh out of bootcamp developers).

> You are doing a lot of deep compares on state in a real world application?

Not a lot, but when you need it you really need it (usually for shouldComponentUpdate, but most recently I needed it for synchronizing state to localStorage).

> I've seen a situation with 24(yup, 24) reducer functions for a single action type.

You're right, that is insane. I personally use thunks or sagas to dispatch multiple actions that are specific to the domain model being updated and never update multiple slices of the state tree with a single action. For example, the action dispatched by clicking the sign in button should not update the user profile and the navigation state. Again, the problem in your example is not redux, it's a lack of separation of concerns.

> Become a components view is not coupled to the global state of your application.

The state of your application has to go somewhere, and if you are creating a small amount of stateful components and a lot of functional components, you are doing a lot of prop drilling, and every time the stateful component is updated the entire component tree gets re-rendered. If you keep the stateful components at the minimum height necessary, your business logic will be split up according to where it needs to be used instead of logically grouped by feature.

> summary, what you are describing is the "theory" of why Redux and associated tools should work.

You are arguing that redux is a poor choice because bad developers write bad code. I'm saying that the constraints that redux imposes on the structure of your code makes it easier to enforce separation of concerns as the app scales in complexity. The things about redux that most people complain about are the things that make it work so well in complex applications. I have seen unmaintainable apps that used redux, and equally unmaintainable apps that used component state. I don't think anyone can accurately say that one is worse than the other in a pathological case. At this point we're just arguing about opinions, but I maintain that explicit structure using shared conventions is still better than ad-hoc structure that requires institutional knowledge to navigate, even in the hands of untrained code monkeys.

One thing I have noticed is that every time react or redux comes up on HN it starts a flame war with the same arguments rehashed over and over, and when I get involved in these discussions none of my comments ever get any up or downvotes, which tells me that nobody is reading this and we should get back to work. :)

Re: None of my projects want to be SPAs

#279
post #241

Earlier quoted context omitted.

Unfortunately for most devs, the only way to set yourself up for "better" work later, is to force current mediocre work to use the tooling of the future work. In 2019 if you have on your resume that you're only familiar with Rails and ERB-sites, and you suggest using them for pretty much everything, you'll never get a new job. At a certain point, career-minded devs have to do the "resume driven development" game a li…

Depends pretty much where one wants to work. Outside the software business, on companies whose focus is totally unrelated to software, no one cares that much how things work. They just have a couple of devs, or hire some freelancers do do some stuff, no matter how, it just has to look pretty.

I feel like this is pretty specific and/or lucky. In my experience, the companies you're referring to also have a person that's worked there for 15+ years and "architected" all of their infra from scratch, in an incredibly unmaintainable way. Sure, they could've done whatever they wanted, but that does not mean that it's better than the alternative.

Re: None of my projects want to be SPAs

#280
post #220

Earlier quoted context omitted.

If you're giving me the choice between dealing with this: > Often, as you learn about the structure of the data, it becomes useful to change how the data is structured and stored. In global state, you can change that in reducers, sure, but then all the places that render that data have to be updated. You don't have the option to represent the same data in different ways that might be more suitable for different parts…

You selectively quoted me, ignoring where I explained that synchronization isn't as big of a problem with passing properties into components. I already addressed your concern. Don't selectively quote me, it's rude and just shows you aren't following the conversation. Futher, Redux doesn't solve synchronization issues in situations where you can't represent the data the same way. In the most complicated situations, it…

I read the thread. You hand-waved away a non-trivial problem by "explaining" properties are a thing. Thanks, bud. I'm sorry I didn't cite your favorite source to your satisfaction, but I quoted the relevant parts of the post I replied to.

> Futher, Redux doesn't solve synchronization issues in situations where you can't represent the data the same way.

It's kind of the whole Redux philosophy that you won't do that. It's in the FAQ. There's no "can't". You're never forced to keep duplicate data in your store.

Post reply on HN