14 ms·
React create composable components
- ThePadawan 8y agoI'm not usually one to ad hominem like this, but IMO you cannot both posit to give advice on good frontend engineering and fiddle with window.onScroll.
- lmilcin 8y agoOr not being able to handle being slashdotted/hackernews-ed.
- hombre_fatal 8y agoWell, even if we were talking about how to build scalable servers (we aren't), I feel like that's some sad, judgy gatekeeping to suggest that one needs to apply those same principles to their own blog else they need to receive such condescension in the comments. It's like saying a real engineer builds their own blog. I wouldn't waste a single second of my life doing so, and the money I'm willing to spend on it reflects that as well. It comes off as petty, to me, to judge someone on this. For example, I'm paid $100k/year to build scalable servers, not my cheap Wordpress blog.
- deleted 8y ago[deleted]
- untog 8y agoI disagree with that one. Reinforcing your personal blog with a CDN would be a waste of money 99% of the time. It's also backend engineering, not frontend.
- iaml 8y agoCloudflare has a free tier.
- untog 8y agoEven still. I spend all day working on this stuff, I definitely can't be bothered to do even more of it when I get home, so I won't blame anyone else that doesn't.
- laurent123456 8y agoJust host it on GitHub with your own domain. It's free, robust, and it means you can change the hosting if you ever want to.
- ChrisSD 8y agoReimplementing basic browser functions (poorly) in Javascript is one of the most annoying trends in web dev.
- wlesieutre 8y agoYeah but wouldn't it be cool if when you spin the mouse wheel it takes ten revolutions and then the page scrolls over sideways, and then you spin it another ten times and it scrolls sideways to page three, etc? True story. I forget where, but I assume they just didn't bother to test it on anything but a Macbook trackpad.
- TuringTest 8y agoYou wouldn't believe what screen transitions they made in the times of Flash.
- wlesieutre 8y agoSure they were terrible, but at least we had auto-playing music to keep us company while we waited
- joshmn 8y agoNow we have both auto-playing music and video. Even on mobile!
- TuringTest 8y agoI'll never forget zombo.com. I'm still waiting!
- azangru 8y agoAre you against listening to the onScroll event in general, or only against scroll hijacking?
- patates 8y agoI'm not the person you are replying to but I have strong feeling that it's the latter. The scroll event has, IMHO, outside the annoying infinite scroll circus and the hijacks, a single good use: Lazy loading of expensive resources (then one would ask why it's not paginated in the first place but well).
- taoistextremist 8y agoIt's more convenient than pagination for the user. At least up until they want to share a specific section
- dmix 8y ago> At least up until they want to share a specific section Which is why I hate automatic pagination unless some sort of anchor or direct URL to a section is made (prominently) available.
- ThePadawan 8y agoI simply find it offputting for anyone to say "I as a web designer know better than you and will smooth your scrolling for you".
- mtrpcic 8y agoSo, the latter then.
- ThePadawan 8y agoI guess. Why would I object to the first? As long as it doesn't impact me, you can listen to whatever the hell you want.
- cntlzw 8y ago/thread
- deleted 8y ago[deleted]
- kakarot 8y agoAs long as you're throttling, there's nothing wrong with interfacing with onScroll. I use it for all sorts of things. Scroll-jacking is the real issue.
- acdha 8y agoShouldn't most of those be using Intersection Observers these days? That should avoid most of the cases where someone unintentionally breaks the user experience.
- antibland 8y agoYes, and another bonus is that Intersection Observer is asynchronous and eliminates the need to tack on an additional debounce function.
- kakarot 8y agoNot yet, but soon: https://caniuse.com/#feat=intersectionobserver https://caniuse.com/#feat=intersectionobserver
- acdha 8y agoGood point: I’ve been using it with polyfills which tends to hit the same point of not using an API which encourages accidental jank but it’s no substitute for native support.
- kakarot 8y agoI am looking forward to switching over. Currently, I try to pool callbacks onto the same onScroll event when I can but it's still janky.
- horsawlarway 8y agoI'm laughing. I literally immediately noticed the scroll-jacking and closed the tab. I then went to the comments to see how far I'd have to dig before finding this - Glad to see it at the top. For the OP (who I'm assuming also owns the blog since the names are the same...): For the love of god - Do not fuck with my control of the browser. I don't want passengers in my car screwing with my mirrors. I don't want sites in my browser screwing with my input.
- rhinoceraptor 8y agoWayback machine link: https://web.archive.org/web/20190115130326/https://www.dzurico.com/react-compound-components-with-usecontext-hook/ https://web.archive.org/web/20190115130326/https://www.dzuri...
- ramigb 8y agowhatever happened to the current article?
- ricardobeat 8y agoMirror: http://archive.fo/dM5mR http://archive.fo/dM5mR
- robjan 8y agoMy click got hijacked and it took me to a PDF reader app on Google Play. Usually you wouldn't expect this kind of behaviour on a personal blog.
- dzurico 8y agoI'm sorry guys can I know what's going on I really dont' understand
- deleted 8y ago[deleted]
- ponyous 8y agoCan somebody think of easier way to implement tabs with current setState functionality? Everyone! It may have few more lines of code but it's gonna be clear and every react dev is gonna know what it does. Seriously, feels like we are going in circles and each round we add another layer of complexity on top. Also a trend I noticed and it bothers the hell out of me is the fact that all these people build todo list apps and blog about it frantically how the world is different now and easier. Maintain an app with xK+ lines of code for a year or two and then tell me about it.
- dzurico 8y agoHi I can understand your point but if a post is written around a difficult example you need more time to understand it then fully understand what the functionality does. In my case I used a todo because everyone know how to do it and you can appreciate how the use of Hooks can simplify or change your code.
- ponyous 8y agoSorry to be PITA. TODO list example wasn't specifically targeted at you. I'm just frustrated because I finished a big migration just Today that was caused by uninformed internet blog posts praising specific library which mostly works only in simple examples (TODO Lists). Thanks for spreading the knowledge, but I think beginners don't take advice as "this is an option of how things can be done" but rather as "this is how we do things and we should follow this". Maybe a paragraph saying when it makes sense to go for this pattern would help.
- acemarke 8y agoOut of curiosity, which library are you referring to?
- ponyous 8y agoSpecifically: `react-native-navigation` replaced with `react-navigation`. Few issues: - Tons of bugs (see next point) - Bigger error/bug surface, 3 languages compared to 1. - Poor documentation - Stopped accepting PRs for 1.0 when they decided 2.0 is the way to go (randomly, 2.0 wasn't nearly ready) - Closing issues without any response (bot that closes them, wtf?) Check Twitter, Google or whatever and people will mostly say positive stuff about it how they are excited and how fun it is for their TODO List app. We tried building something more sophisticated and it's insane how many things don't work as documented. Note: react-navigation is also pretty bad, it improved in last year, but there is nothing better in the react-native ecosystem (there used to be something but during my months of inactivity it was removed from the RN itself). Can probably compile a list of high profile libraries that suck if anyone is interested...
- halfmatthalfcat 8y agoWhat's the point of using Typescript if everything is typed as any or provides no types at all (as demonstrated in the article)?
- notus 8y agoThey are not using it correctly. Using any should just be a stopgap measure mostly for when you are converting a codebase to Typescript. This is just an example of someone using something because they think they should be using it.
- Zooper 8y agoThere is no point in Typescript, as new ECMAScript specs provide most of the syntactic sugar and compile-time type checking is obviated by exactly 1 test, which people using it are writing anyway; this is not a compelling use-case for an entirely new syntax, and it needs to die, instead of contributing to the already-bloated ecosystem.
- stackola 8y ago>compile-time type checking is obviated by exactly 1 test >1 test per code path?
- ncphillips 8y ago> compile-time type checking is obviated by exactly 1 test I’m pretty sure this is an indefensible argument
- neurotrace 8y agoWhat's with the title? The title on the article is fine but the one on Hacker News is terrible. It doesn't mention anything to do with hooks and components are supposed to be composable. That's kind of the goal.
- stupidcar 8y agoI find it ironic that Angular's dependency injection system attracted so much disdain, particularly from React advocates, then React ends up implementing a less-powerful and more verbose equivalent in its new context API.
- talkingtab 8y agoNot to deny any and all of the points made, but getting beyond those, it would be nice to get an assessment of using the new react hooks and especially the context in this manner? I find the whole thing of reusing components in React harder than I would hope, and I find the hook API has let me remove massive amounts of code. The context API does the same thing, so combining them in some way ...?
- kansface 8y agoHooks are an attempt to reuse stateful logic. This is a problem that React never solved well moving from mixins, to higher order components, to children as render functions, and finally to hooks (maybe!). Ideally, hooks would also fully replace eg usage of react-redux even if that isn't their stated goal (managing global state across components is not really the same thing as reusing stateful logic). In fact, I don't really care about the former at all in the case of the later. The current hooks API is not up to the task, or even up to integrating with react-redux given constraints around the new concurrent rendering and reasonable performance [1]. Hooks run during render with no ability to bail, while react-redux requires a way to avoid calling render in the first place to avoid every connected component re-rendering on every state change (ie, basically the whole tree)[2]. The new context API is also not ready for the limelight [3]. Hooks would solve some problems but at the expense of introducing yet another way to do some things. They can't replace react-redux or even provider a cleaner binding. Using hooks is risky because the API really ought to change to make them more useful, and they aren't particularly performant or powerful. 1. https://github.com/facebook/react/issues/14110#issuecomment-447040520 https://github.com/facebook/react/issues/14110#issuecomment-... 2. https://github.com/facebook/react/issues/14110#issuecomment-448070764 https://github.com/facebook/react/issues/14110#issuecomment-... 3. https://github.com/facebook/react/issues/14110#issuecomment-448074060 https://github.com/facebook/react/issues/14110#issuecomment-...
- talkingtab 8y agoWhen the context API was released I began to rip out redux. After things went well with that, I no longer use redux, and I was a big fan of redux. A problems I had with using context was what seemed to me like a crufty way to access it - the whole wrapping things in a Provider. Now, I can just rip out more code and use the context hook. I'm a big fan of technologies that let you rip out tons of code. My experienc e then is that hooks are a great improvement. So far ....
- mstijak 8y agoCxJS uses the same concept for charts, form validation, and other inter-component communication. https://docs.cxjs.io/charts/line-graphs https://docs.cxjs.io/charts/line-graphs