Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

How Redux Works: A Counter-Example

daveceddia.com

Post reply on HN
Print view View original

71–80 of 84 posts

Re: How Redux Works: A Counter-Example

#71

Post by interlocutor »

whitefish wrote: post #64
arximboldi wrote: post #54

Earlier quoted context omitted.

Then your controller needs to know about 1) all existing views and 2) all effects of model update logic. Again, you end up with low decoupling with points that you can only change with global knowledge (and lots of potential effect interleaving). If you already have a "plain data" model, the next logical step is to just get rid of stateful controller and use a simple data-flow Redux-like flow for updating the UI. I g…

Sorry, that’s not making sense. In the MVC I am used to there’s only one controller active at one time and that controller owns the entire screen.

@arximboldi, I wouldn't use MVC for implementing something like Photoshop or and IDE, that's not the kind of application MVC is good for. MVC works well for applications that navigate through multiple screens.

Re: How Redux Works: A Counter-Example

#72

Post by ess3 »

krishanath wrote: post #29
robmcm wrote: post #4

There is a certain paradox with teaching something like Redux, in that it's designed to make complex systems easy to understand and manageable. Yet when trying to demonstrate with a simple example, it appears hugely over complex and unnecessary. I think a pre-requisite to learning something like Redux (or any micro-architecture) is to first try building something without it. Once you understand the pains of undiscipl…

>> it appears hugely over complex and unnecessary Which it is, actually! Think about how MVC works in iOS, or ASP.NET MVC or JSP Model 2, etc. In the case of the latter two, your state is stored in the session as simple, regular objects. Have you felt the need for actions and reducers and immutability etc. when using session state? I have not. When programming JavaScript SPA, you can program in the style of MVC also.…

I think the main problem is that MVCs aren't really a good way to write interfaces. You have so many state values that needs to be stored somewhere (dropdowns, input values etc). I'm not saying that redux is a good use-case everywhere but trying to write MVCs on the web is not a good fit. React is not a MVC library and not only the view part of it either...

Re: How Redux Works: A Counter-Example

#73

Post by tootie »

acemarke wrote: post #65
tootie wrote: post #59

Earlier quoted context omitted.

I think it's mostly react-redux. There's arcane boilerplate in the connect function, mapDispatchToProps looks like a leaky abstraction, actions being passed as objects with a string in them is super brittle. I don't have a fix, but I think just being able to inject a link to the store and then having an API that can be manipulated directly from the component would more comprehensible and cut down on the layers of ind…

Appreciate the feedback. Could you give specific examples of what you mean by "arcane boilerplate" and "leaky abstractions"? We don't have any plans to change the actual API, but I would genuinely be interested in any suggestions or concerns you have with it. It's also worth noting that I personally highly recommend consistently writing separate action creator functions [0], and using the "object shorthand" argument…

I guess it's a matter of taste, but using object shorthand for an API seems like and anti-pattern. APIs are where a rigorous definition is most valuable. Like I said, it works fantastically well once you get the hang of it, but try showing this to a newb and ask them to trace it. Nightmare.

I'm not being a grump either. I coded Perl professionally for over 5 years and am well-versed in terse, functional idioms, but the community rightfully decided that strings of punctuation were too obtuse for practical use.

Re: How Redux Works: A Counter-Example

#74

Post by ergo14 »

leshow wrote: post #3
ergo14 wrote: post #2

It is interesting how people have the idea that react === Redux/flux. Where in fact Redux is unopinionated and works with other libraries/frameworks just fine.

How often do you see redux used with anything other than react? Or are you just talking about redux working with react alternatives like preact/inferno, etc? You're not wrong, but practically 99% of people pair it with react.

People use it with Polymer (a lot of people in the community use it with polymer-redux package) and Vue. React alternatives that you mentioned are also a thing.

Re: How Redux Works: A Counter-Example

#75

Post by koolba »

danenania wrote: post #60
koolba wrote: post #10

Earlier quoted context omitted.

> Once you understand the pains of undisciplined, organically designed, spaghetti applications, the cynicism is replaced by excitement over how this will improve your job/life/application. Beautifully said. The same goes for schema-less data models. The full appreciation of foreign keys, data type validation, and check constraints doesn't kick in until you try incrementally changing a NoSQL spaghetti app.

Similarly, I've always liked javascript's dynamic and flexible nature, especially for ui programming where requirements evolve quickly and dramatically. But now that I've got a big redux app that is on a pretty steady course, I'm starting to see the value that static types would bring. A lot of the mental overhead of working with the codebase now consists of remembering the exact shape of all the data, which properti…

I've been singing the praises of Typescript since the first day I started playing with it. Easing into it from a JS codebase is pleasant enough, but greenfield development with typing everywhere is incredible. I highly encourage checking it out sooner rather than later.

Re: How Redux Works: A Counter-Example

#76

Post by sailfast »

dceddia wrote: post #35
sailfast wrote: post #17

I appreciate the author's work to explain this, and I like starting without Redux as a demonstration - definitely a good idea to figure out what React does on its own first. That said, I found the reverse approach to Redux to be more confusing than the actual Redux documentation and the tutorials that Dan Abramov has already put together around Redux which explains things quite lucidly. Example: https://egghead.io/le…

First - thanks :) Second - it's interesting you found the reverse approach to be confusing. I've heard from multiple people that loved it and said it made more sense to them that way. Different strokes and all that! How experienced were you as a dev before you read the Redux docs + Dan's tutorials? I ask because I learned with those too, and they made sense to me (Dan's egghead videos were eye-opening), and I've been…

Hi there and thanks for the response. Certainly not a beginner - been working in the field awhile and I'd worked previously with app frameworks like Angular and a written a number of other less "frameworky" apps before that. Could be an indicator as you mention :)

The thing I found so compelling about Redux was thinking about state being immutable unless you took the original state {...} and changed with a reducer, which was called depending on the action you want to take. At that point, when something is changed, the whole app is changed - it's the one thing to rule them all. If you want to change something, you need to take action. "How do you change state?" "Take an action."

Without understanding that flow up front it was hard to determine _why_ one would need to do things like connect, createStore, etc and how state magically got to be a prop.

I think your walk-through does a great job of explaining things step by step starting from the react code (and what Redux replaces) and I can see it working well for a number of learning styles. I also really like the pancake syrup provider imagery.

Re: How Redux Works: A Counter-Example

#77

Post by sailfast »

acemarke wrote: post #42
sailfast wrote: post #17

I appreciate the author's work to explain this, and I like starting without Redux as a demonstration - definitely a good idea to figure out what React does on its own first. That said, I found the reverse approach to Redux to be more confusing than the actual Redux documentation and the tutorials that Dan Abramov has already put together around Redux which explains things quite lucidly. Example: https://egghead.io/le…

Dan's teaching style is very much "from first principles". You can see that in his Egghead videos, as well as the "Middleware" page in the Redux docs [0]. I've seen feedback that Dan's teaching style is the greatest thing ever, and feedback that it requires a giant leap of faith that "we write thing A, and thing B, and thing C, and magically they all work together at the end". Clearly, different people have different…

Yeah - I can see that. "It's all functions so it all works" haha. I think the context setter that helped for me was to see "hey here's what I see with state, and here's how I think about it and did the thing" at React EU: https://www.youtube.com/watch?v=xsSnOQynTHs

Re: How Redux Works: A Counter-Example

#78

Post by Scarblac »

ess3 wrote: post #72
krishanath wrote: post #29

Earlier quoted context omitted.

>> it appears hugely over complex and unnecessary Which it is, actually! Think about how MVC works in iOS, or ASP.NET MVC or JSP Model 2, etc. In the case of the latter two, your state is stored in the session as simple, regular objects. Have you felt the need for actions and reducers and immutability etc. when using session state? I have not. When programming JavaScript SPA, you can program in the style of MVC also.…

I think the main problem is that MVCs aren't really a good way to write interfaces. You have so many state values that needs to be stored somewhere (dropdowns, input values etc). I'm not saying that redux is a good use-case everywhere but trying to write MVCs on the web is not a good fit. React is not a MVC library and not only the view part of it either...

Isn't that part of what MVC tried to solve in the first place, by giving every single UI element its own model?

Re: How Redux Works: A Counter-Example

#79

Post by Scarblac »

whitefish wrote: post #64
arximboldi wrote: post #54

Earlier quoted context omitted.

Then your controller needs to know about 1) all existing views and 2) all effects of model update logic. Again, you end up with low decoupling with points that you can only change with global knowledge (and lots of potential effect interleaving). If you already have a "plain data" model, the next logical step is to just get rid of stateful controller and use a simple data-flow Redux-like flow for updating the UI. I g…

Sorry, that’s not making sense. In the MVC I am used to there’s only one controller active at one time and that controller owns the entire screen.

In the original Smalltalk MVC pattern, every single element of the UI had its own model, view and controller.

Since then a lot of different things have been called MVC..

Re: How Redux Works: A Counter-Example

#80

Post by newbear »

zebraflask wrote: post #37
krishanath wrote: post #29

Earlier quoted context omitted.

>> it appears hugely over complex and unnecessary Which it is, actually! Think about how MVC works in iOS, or ASP.NET MVC or JSP Model 2, etc. In the case of the latter two, your state is stored in the session as simple, regular objects. Have you felt the need for actions and reducers and immutability etc. when using session state? I have not. When programming JavaScript SPA, you can program in the style of MVC also.…

Agreed! Redux is cool but often overkill for basic CRUD apps, which the majority of JavaScript SPAs tend to be. My approach has been to take a long look at the app structure - if there's a way to refactor it to remove Redux (or what have you), that's probably the most sensible thing to do. Simple code > clever code where performance and maintainability are concerned. I wouldn't mind a use case where Redux would be ne…

Hey, this is a bit tangental but since you mention building enterprise SPAs I'll guess your experience will be able to help me. So, I'm not as experienced but can get around to learning any code and as I need to start building a portfolio I dove in again to build one. But things were breaking and I couldn't get rolling as fast I thought and although for a longer term bigger project I would spend the time tweaking I want to get something up fast and thought that I need to use a simpler tool. So, I'm curious what to you use to build your SPAs? What's the process like for you? Thanks
Post reply on HN