TE
科技回声
首页24小时热榜最新最佳问答展示工作
GitHubTwitter
首页

科技回声

基于 Next.js 构建的科技新闻平台,提供全球科技新闻和讨论内容。

GitHubTwitter

首页

首页最新最佳问答展示工作

资源链接

HackerNews API原版 HackerNewsNext.js

© 2025 科技回声. 版权所有。

React and Redux are a joke right?

120 点作者 oal将近 8 年前

33 条评论

bauerd将近 8 年前
&gt;In the react world though you can’t <i>mutate</i> your data.<p>Wrong, you&#x27;re free to mutate your data. What&#x27;s immutable is the virtual DOM fragment that a component maps the data onto. If you want to manipulate the DOM directly (and it can make sense), how about not choosing a virtual DOM&#x2F;diffing library?<p>&gt;If you get 3 people react will end up re-rendering 3 times because of the code above.<p>Yeah, because the code above is obviously not a good idea. If you receive a list of people and loop over the members, each time triggering a rerendering, it&#x27;s your fault?<p>&gt;So what about trees of data with redux? The docs tell you try not have nested data. Instead put things in flat arrays and use indices to reference things in other flat arrays.<p>I&#x27;m not sure what part of the docs this refers to, but state in Redux is literally organised in a <i>tree</i> and you&#x27;re free to choose data structures for the nodes that make sense. I&#x27;ve found that deeply nested structures make it more cumbersome to write reducers for.<p>&gt;Why is the UI library dictating how we store and manipulate our data!!!<p>It does not do this, it&#x27;s a virtual DOM&#x2F;diffing library (!!!).<p>&gt;Maybe someone needs to start the browser over.<p>This is a highly incoherent rant that mixes up criticism of immutable data structures, the Flow architecture, virtual DOMs and the Redux API. The quote above doesn&#x27;t surprise me in the least.<p>Having said all this, the approach commonly taken by React&#x2F;Redux is certainly not a silver bullet for every problem domain, but then what is?
评论 #15052993 未加载
评论 #15052960 未加载
neya将近 8 年前
I&#x27;m one of the laggards - Over the years, based on staying around tech communities (esp. HN) I&#x27;ve learned not to invest time &#x2F; effort into the hype that surrounds a newly launched tech. I did burn my finger a couple of times, especially with MongoDB back then, so these days I&#x27;m pretty cautious.<p>I&#x27;m one of the very few who didn&#x27;t invest in React. I waited it out and invested into Vue.JS, instead. This is no framework war, purely based on opinions.<p>My opinion is pretty simple and resonates with a lot of people, apparently[1]:<p><pre><code> ~15 years trying to make everyone separate HTML, JS &amp; CSS. And then suddenly everything went south and we’re writing code like this: [1] </code></pre> This alone makes React a joke for me, let alone the author&#x27;s post. If it resonates with you, then good for you. I may not be from Facebook or Google to have the authority, but I do know what&#x27;s good in the long run and what isn&#x27;t. I couldn&#x27;t be happier with Vue.<p>[1] <a href="https:&#x2F;&#x2F;twitter.com&#x2F;thomasfuchs&#x2F;status&#x2F;810885087214637057?lang=en" rel="nofollow">https:&#x2F;&#x2F;twitter.com&#x2F;thomasfuchs&#x2F;status&#x2F;810885087214637057?la...</a>
评论 #15053160 未加载
评论 #15053159 未加载
评论 #15053169 未加载
评论 #15053170 未加载
评论 #15053134 未加载
评论 #15053181 未加载
评论 #15053190 未加载
评论 #15053168 未加载
davidmurdoch将近 8 年前
I started working on a react native+redux project myself recently (after working with react on its own for about 1 year) and have been feeling the same way. And we&#x27;ve just been working on auth, data persistence, and screen navigation.<p>My problem with it is that there is so much abstraction that almost no prior knowledge from using other frameworks or libraries is useful. It seems like everything is magic.<p>Here is a chain of react tech things: React-&gt;Flux-&gt;Redux-&gt;Redux-Persist-&gt;PersistGate<p>The latter is talked about in documentation, i.e., &quot;do it like PersistGate does&quot;, but I can&#x27;t find PersistGate anywhere.<p>With so many react extensions and libraries all having their own helper functions to do everything it seems like we are no longer programming, but instead, we are tasked with stringing together configuration functions after searching for hours for the currently relevant documentation.<p>I think react does some pretty amazing things, but the learning curve is too steep because of fragmented documentation (mostly the community created how-tos are the problem here), confusing abstractions, and poor method naming (thinking about redux&#x27;s `reducer` here).<p>Anyway, I, and several programmers at my company, share your sentiments; you are not alone. This will probably be my last greenfield react project.
评论 #15054229 未加载
captainmuon将近 8 年前
The article has a point. We tend to fix issues with state by avoiding mutability. That is like going to a doctor because it hurts when you laugh, and they just say &quot;don&#x27;t laugh&quot;. I wish there was a language that <i>embraced</i> mutability instead [1]. Mutability is how the computer works at the lowest levels, and how we tend to think about the world.<p>You would use plain old data objects to store everything. Then you would have first class observers, meaning you could have callbacks react to any changes to any object. But you wouldn&#x27;t use that low-level functionality often. Instead you would e.g. create a listview, and just set it to observe the array. This is like &quot;list adapters&quot; that are in many frameworks, but built into the language.<p>One thing that I&#x27;d love to be able to do is to have the data as plain-old-objects, updated frequently from one thread, and the gui living on another thread that observes it occasionally in a read-only fashion (and occasionally sends mutating messages to the backend thread). You could implement that with read-write locks, but as far as I know no framework supports it directly.<p>Maybe this language would have a special block that takes imperative, mutating code, and lifts it to implement the command pattern [2]. You then could &quot;undo&quot; these blocks, coalesce them, and so on. (That doesn&#x27;t work with arbitrary code, but with most code that operates on business data.)<p>(Here are some questions I asked on StackExchange, trying to find out if something like that already exists:)<p>[1]: <a href="https:&#x2F;&#x2F;softwareengineering.stackexchange.com&#x2F;questions&#x2F;229876&#x2F;language-that-embraces-mutable-state" rel="nofollow">https:&#x2F;&#x2F;softwareengineering.stackexchange.com&#x2F;questions&#x2F;2298...</a> [2]: <a href="https:&#x2F;&#x2F;softwareengineering.stackexchange.com&#x2F;questions&#x2F;351593&#x2F;automatically-convert-mutations-in-imperative-code-into-functional-actions" rel="nofollow">https:&#x2F;&#x2F;softwareengineering.stackexchange.com&#x2F;questions&#x2F;3515...</a>
评论 #15053193 未加载
评论 #15056476 未加载
评论 #15053153 未加载
allover将近 8 年前
Stopped reading half-way through, as lots of incorrect stuff off the bat.<p>&gt; In the react world though you can’t <i>mutate</i> your data<p>Sure you can.<p>&gt; If you get 3 people react will end up re-rendering 3 times because of the code above. Each call to `setState` triggers a re-render.<p>Nope, calls to setState are batched.
评论 #15052800 未加载
评论 #15052858 未加载
评论 #15052804 未加载
tck30将近 8 年前
tl;dr of this blog post: &quot;Oh no, I don&#x27;t understand how immutable data structures work and need to rant about why it doesn&#x27;t make sense!&quot;<p>I don&#x27;t want to be mean about it, but there&#x27;s a lot of literature on functional programming and how mutable data complicates things as your states increase. The problem isn&#x27;t how React forces you to write long code to get around immutability, the problem is the fact that you&#x27;re trying to force your approach.<p>And no, this isn&#x27;t because React is heavily opinionated -- it&#x27;s because React&#x27;s underlying philosophy is functional programming.
评论 #15052949 未加载
coldtea将近 8 年前
Judging from the title I expected one of the usual BS posts like &quot;OMG, React mixes code and html!!!&quot; etc and was ready to post a &quot;No, you just don&#x27;t get it&quot; comment.<p>But this actually makes several good points on accidental complexity imposed by React&#x2F;Redux.<p>I know why they impose it, but there must (should) be a better way.
bichiliad将近 8 年前
There&#x27;s a lot of comments in here addressing some of the conceptual misunderstandings of &quot;how to use react&quot; (i.e. &quot;use immutable.js&quot;, etc). I started writing React within the last year and, while I still find parts of it strange, I&#x27;ve found its real strength comes from the fact that it&#x27;s easy to reason about, particularly at scale. In a large project, I don&#x27;t find myself digging around the codebase looking for the place where event listeners are being bound, or where a piece of the DOM is getting mutated. The unidirectional flow of data makes it very easy to jump into a piece of an app.<p>It&#x27;s not without its complexities, however. Mainly:<p>1. using JSX, instead of a more transparent templating language, means people with less technical knowledge (i.e. product designers) have a higher barrier to entry when trying to make simple UI changes (I&#x27;m looking at you, `className`).<p>2. it is unclear at times whether a component should have its properties passed in directly from state through `mapStateToProps`, or from a parent component through `props`.<p>3. there does seem to be an tiring amount of boilerplate when adding a new piece of interaction to a component (an action, an action type, a reducer case, and usually a piece of state all need to be added).<p>4. to a newcomer, the benefits of immutable.js are apparent, but the benefits of a memoizing layer like reselect.js were less obvious. When you&#x27;re still trying to wrap your head around How To Write React Things™, it&#x27;s not apparent that you&#x27;d even <i>need</i> memoization (&quot;isn&#x27;t React supposed to be good at diffing stuff?&quot; you ask yourself after watching large pieces of your app redraw itself over and over).<p>I&#x27;m curious to hear how people deal with these particular issues. React was one of the more useful tools I learned about this year, and I&#x27;d love to see the process for newcomers to React become less frustrating.<p><i>Edit: formatting</i>
joncampbelldev将近 8 年前
If the author wishes to continue with js&#x2F;react&#x2F;redux then he needs to pick up a library like immutable.js to cut down that immutabiilty helper crap.<p>However, there is a better way ... lein new figwheel my-app, clojurescript+reframe gives you all the benefits of redux with an order of magnitude less boilerplate (also hot reloading and immutability by default without no extra setup or ceremony)
评论 #15052794 未加载
评论 #15053253 未加载
评论 #15053227 未加载
Tade0将近 8 年前
I think the author may like to consider Vue.js + Vuex. In Vuex in particular the first argument of each mutation is the store state, which you can mutate how you wish and the framework takes care of the rest.
评论 #15053018 未加载
mamon将近 8 年前
Maybe this is stupid question, cause I don&#x27;t know React or Redux, but why would anyone want the data structures holding page data to be immutable? Data can change any time due to user actions, immutability would only get in the way, wouldn&#x27;t it?
评论 #15052819 未加载
评论 #15052812 未加载
anilgulecha将近 8 年前
I get his point -- javascript object observation has been a pain, and causes the stated workaround.s<p>With new API like Proxy [1], we should not be able to just modify data as needed, and any observers can be notified by handlers in the object get&#x2F;set. This will lead to data being fully mutable.<p>[1] <a href="https:&#x2F;&#x2F;developer.mozilla.org&#x2F;en-US&#x2F;docs&#x2F;Web&#x2F;JavaScript&#x2F;Reference&#x2F;Global_Objects&#x2F;Proxy" rel="nofollow">https:&#x2F;&#x2F;developer.mozilla.org&#x2F;en-US&#x2F;docs&#x2F;Web&#x2F;JavaScript&#x2F;Refe...</a>
评论 #15053963 未加载
franzwong将近 8 年前
Choose the tool which is suitable for you. When your web app grows to a certain scale, you will need &quot;lots of code&quot; to maintain state and prevent rendering.
agentultra将近 8 年前
&gt; This is probably an ill thought through rant but...<p>Everything after the &quot;but&quot; and all.<p>The whole point of Redux is to separate actions and state manipulation. An argument that, &quot;well I want to manipulate variables feely,&quot; is not an argument. Just don&#x27;t use Redux. End of story.<p>The pattern doesn&#x27;t come from React. There are many patterns in React that are just Monads by a different name. Redux isn&#x27;t much different.
thenewvu将近 8 年前
React does its job fine. I think the good part of the post is pointing out the verbosity of Redux and you don&#x27;t accept it. According to me, it totally depends on your implementation, Redux is just a concept of data flow, you made your choice when using react-redux. By time and eventually, you will figure out how to minimize the boilerplate, because you didn&#x27;t accept it.
LoSboccacc将近 8 年前
Without a big push in uniforming and standardizing ways to listen to property changes on both objects and components there won&#x27;t ever be a sane UI framework in javascript, it&#x27;s simple as that.<p>They&#x27;ll either be too limited so that you cannot express the full featureset of html within their bindings without hacks or too convoluted to use and impossible to debug.
skilesare将近 8 年前
I&#x27;ve tried to &#x27;get&#x27; redux a couple of times and have reverted back to reflux each time because sanity is nice.
mariusandra将近 8 年前
Try using ES destructoring and spread operators plus a library like Kea (<a href="https:&#x2F;&#x2F;kea.js.org" rel="nofollow">https:&#x2F;&#x2F;kea.js.org</a>) to provide a framework over Redux and most of these arguments become irrelevant.
评论 #15052906 未加载
websitescenes将近 8 年前
Honestly, I don&#x27;t recommend using React unless you&#x27;re building realtime web applications. Otherwise, you&#x27;re correct, React is too heavy. If you&#x27;re not doing realtime, the idea of state is completely unnecessary. But if you are doing realtime web apps the idea of state and hoops that React make you jump through make sense. Is it hard? Yep. Is it worth it. Yep. Will there eventually be a better way? Yep. With that said I think some of the pain points you identified could be simplified. State is needed but immutability could be made easier.
luord将近 8 年前
After reading so much about it and trying it several times, I think my problem with react (alongside the licensing issue anyway) is that it feels like the perfect example of the fundamental theorem of SE: Everything is full of indirections and, when that isn&#x27;t enough, then more abstractions in the form of tangentially related libraries (such as immutablejs in this thread) are recommended.<p>I&#x27;m sticking with Vue, it&#x27;s not perfect but it was at least designed to play with js&#x27;s strengths instead of abstracting them to shoehorn functional principles.
amelius将近 8 年前
Could somebody outline how I can write an efficient rich text editor using the state management techniques of React and Redux?<p>(Not that I want to try this, but I&#x27;m interested in how that would work).
评论 #15053461 未加载
shafyy将近 8 年前
I agree that there is some amount of boiler plate code to Redux that doesn&#x27;t seem to make sense and takes a long time to do when you&#x27;re new. But I think it really helps with maintenance and scalability of projects down the road and saves you time later on.<p>Of course, as others have said, React and Redux is not a panacea - depending on what you want to achieve and on your personal preferences there might be better tools.
评论 #15055718 未加载
tboyd47将近 8 年前
This guy expresses a lot of opinions about React&#x2F;Redux that I share, but he doesn&#x27;t understand something fundamental about web development. The look and feel of the page comes first, and the structure and coherence of the code comes second. And you don&#x27;t really need complicated, fast UI for most web projects.
评论 #15053569 未加载
obfk将近 8 年前
WHY would you even considering composing your own diffing structure for updating a components state when that&#x27;s entirely against the paradigm React proposes. Pass props from the parents and let the tool do the heavy lifting. State is an abused and misunderstood interface in React.
littlecranky67将近 8 年前
Author complains about &quot;lots of code&quot; needed for changing his data, but at the same time refuses to use modern ES6 features.Most of his code would come down to 2-3 lines when using destructuring and object&#x2F;array rest operator.
评论 #15053366 未加载
keymone将近 8 年前
yep, let&#x27;s all just get back to mutating everything everywhere and generating dom elements in arbitrary places. because it has worked so well for us in past 12 years.<p>i get a feeling author had no prior experience with js ui whatsoever.
sotojuan将近 8 年前
Not the biggest JS fan but this is ill-informed and poorly written. Sounds about right for tech blog posts at least.
romanovcode将近 8 年前
Some people like immutability, some don&#x27;t. It&#x27;s the way of life.
Harkins将近 8 年前
This example doesn’t fit with the React style I’ve seen before, where state is rarely used. This data isn’t flowing (<a href="https:&#x2F;&#x2F;lobste.rs&#x2F;s&#x2F;ptfoib&#x2F;yes_react_is_taking_over_front_end#c_1z3hjq" rel="nofollow">https:&#x2F;&#x2F;lobste.rs&#x2F;s&#x2F;ptfoib&#x2F;yes_react_is_taking_over_front_en...</a>) like I’ve come to expect, but one of my biggest gripes with React is that the docs are no longer very good because they haven’t been comprehensively rewritten for the current design and because the only sentence in the docs to address the crucial distinction between props and state is the distinctly unhelpful:<p>&gt; If you imagine a component tree as a waterfall of props, each component’s state is like an additional water source that joins it at an arbitrary point but also flows down.<p>In this post’s example, I would expect to see a component for an individual Person with the props name and location, then a People component storing the ordered list in props. If the app does a lot of this general “maintain a sorted list with random insertions from over the net”, People would be wrapped by a higher-order component (<a href="https:&#x2F;&#x2F;facebook.github.io&#x2F;react&#x2F;docs&#x2F;higher-order-components.html" rel="nofollow">https:&#x2F;&#x2F;facebook.github.io&#x2F;react&#x2F;docs&#x2F;higher-order-component...</a>) managing that. Otherwise there’d probably be a page-level custom component or just random stateful javascript pulling in the data and passing it down to People for rerendering. (I don’t know Redux to address the second half of his example.)<p>It’s ironic that the author advocates for immediate mode GUIs, because normal React looks and works like an immediate mode GUI with memoization. A component is a function responsible for part of the page. Its props are the input to the function and it returns a render of part of the page (possibly by rendering more memoized components). The cache is busted when props changes. There’s also a hack to be used sparingly called state so that small bits of UI state can be managed at a low-level instead of in their parent component.
Nekorosu将近 8 年前
Somehow author jumps from the problem of convenient data structures updating and immutability to Redux which solves a different problem.<p>There are several things about React, Redux and React based tech stacks:<p>1. React requires knowledge of basics of functional programming<p>React looks like it&#x27;s easy to pick up but if you don&#x27;t know or want to learn at least basics of functional programming then it&#x27;s not for you. Without this knowledge, a lot of things will be a struggle and won&#x27;t make any sense. You&#x27;ll mess up pretty bad. React requires the understanding of its principles which require the understanding of FP essentials.<p>2. React is not a framework and does only one thing well<p>It does only one thing well, turning your UI into a function of data. Yes, there is a virtual DOM but it&#x27;s an implementation detail and not the purpose of React. If you think about it everything which is there is needed to make that UI=F(data) possible. However, it&#x27;s enough for simple apps.<p>Immutability isn&#x27;t always needed so it&#x27;s optional. It&#x27;s not built into JS, you&#x27;ll have to use an additional library.<p>3. Building non-trivial apps requires a lot of knowledge and experience<p>Building non-trivial apps with React only is a pain. That&#x27;s expected because the only thing it does is making a UI a function of data. It&#x27;s not a framework with a complete set of tools and practices for building a whole SPA. That means you have to assemble your own tech stack for your particular task. This requires a lot of experience but lets you have the tools which are a better fit for your app.<p>Redux is just one of the available choices for solving the problem of complex app&#x27;s architecture. It isolates state from React components. UI interaction with the outer world is behind actions. Data access is behind selectors. State mutations are centralized in reducers. This is very convenient, you always know where to look for something. Business logic part is very clear because of actions and reducers. Not messing everything up requires knowledge and discipline though.<p>The funny thing is React+Redux isn&#x27;t a complete framework. For case, there are several solutions for writing asynchronous actions.<p>The main idea is React is ok to use by itself for simple things. You don&#x27;t need to know much except FP essentials. Using more advanced React based tech stacks requires much more knowledge and experience.<p>If you don&#x27;t know which of your problems React solves you don&#x27;t need it.<p>If you don&#x27;t know which of your problems immutability solves you don&#x27;t need it.<p>If you don&#x27;t know which of your problems Redux solves you don&#x27;t need it.
评论 #15053612 未加载
williamle8300将近 8 年前
Seems like the source of his gripes are with functional programming, not ReactJS itself.
sambeau将近 8 年前
TL;DR: Author confuses Redux for React and then rants about it.
halayli将近 8 年前
It doesn&#x27;t feel op have done their homework well.<p>You should check immutable-js.