12 ms·
Hyperapp – A tiny framework for building web interfaces
- PufPufPuf 6y agoI have tried Hyperapp some time ago. It's usable for small apps, but the lack of ecosystem makes it unfit for anything larger -- as is usual for all niché JS frameworks. Funnily, the "ecosystem" page contains just Lorem Ipsum (https://hyperapp.dev/ecosystem https://hyperapp.dev/ecosystem) and the Awesome Hyperapp section for V2 is almost empty (https://github.com/jorgebucaran/awesome-hyperapp https://github.com/jorgebucaran/awesome-hyperapp)
- ricardobeat 6y agoIt's been like that for months - seems like the project is not seeing the activity they expected for v2. Also server-side routing is broken and that link will not work.
- jorgebucaran 6y agoWe are very close to the official V2 release, but right now that page is still a WIP. The link works fine, though.
- dsissitka 6y agoIt’s broken here too.
- jorgebucaran 6y agoDo you know why?
- dsissitka 6y agoOooh, I see. It (https://hyperapp.dev/ecosystem https://hyperapp.dev/ecosystem) is broken if you've never been to https://hyperapp.dev https://hyperapp.dev before.
- jorgebucaran 6y agoAh, gotcha gotcha. Thank you for reporting it! :)
- cortesoft 6y agoYeah, I got a 404 page when visiting it, too.
- doctoboggan 6y agoI am on macOS / Safari 13.2.1 and I can not visit hyperapp.dev/ecosystem after visiting hyperapp.dev
- vages 6y agoThe link does not work.
- jorgebucaran 6y agoAny idea why? Any info you can share would help us debug whatever the issue is.
- european321 6y agoMissing a wildcard route? No idea how your routing is setup
- jorgebucaran 6y agoIt's all client-side. When I click that link, it opens the site as usual.
- shripadk 6y agoClick the link directly: https://hyperapp.dev/ecosystem https://hyperapp.dev/ecosystem As the parent said, you don't have a catch-all route. That is why!
- jorgebucaran 6y agoThat's what it is, thank you for clarifying.
- deleted 6y ago[deleted]
- satyrnein 6y agoAlso, if you click "join us" and then "tutorial" your scroll position is in an unexpected place.
- foobarbecue 6y agoIs niché a portmanteau of niche and cliché?
- pkghost 6y agoGood content.
- bigblind 6y agoNo, it's niche with a French accent
- Uehreka 6y agoIt’s pronounced “NEE-chuh”.
- escapecharacter 6y agoLike Nietzsche?
- inamorty 6y agoMore like neesh.
- HumblyTossed 6y ago> but the lack of ecosystem makes it unfit for anything larger What does this mean?
- sb8244 6y agoI interpret this as you need to do everything yourself rather than using off-the-shelf libraries.
- RobertKerans 6y agoLack of libraries, as sibling says. Any libraries that exist are not generally well supported relative to similar libs for popular frameworks. Much smaller community, much less ease at finding others who may have had similar issues. Fewer eyes on, fewer bugs picked up. Fewer contributors, slower fixes/updates. Docs there are tend to atrophy faster. Developed with Hyperapp on big prod apps about three years; was used to inject small amounts of interactive functionality into existing apps (.Net with jQuery powered frontends). Sorta worked, nice, simple idea, but docs almost nonexistent at the time (to be fair there's very little to it), was in process of being dumped for React just as I was leaving (to work on apps with Elm frontends, which Hyperapp takes a lot from, and suffers from similar issues, heh)
- apozem 6y agoSome problems are hard, common and already solved. Sometimes solving these problems yourself adds no unique value to your product. In that case, you should just use a well-reviewed external ecosystem package. A large project will run into many of these problems. It is a waste to re-invent the wheel because a cool new framework has too few pre-made wheels.
- jorgebucaran 6y agoWe're so close to the official V2 release, but there are still issues. I'll make sure to fix most by then. You totally have a point about the lack of an ecosystem, but building one is where the fun is. I am sure we'll get there! Thank you for your feedback.
- HHalvi 6y agoTheir guide (https://hyperapp.dev/guides https://hyperapp.dev/guides) page is also filled with Lorem Ipsum.
- jorgebucaran 6y agoOuch, yes, that's also a WIP, thank you for checking in, though.
- bigblind 6y agoThe quickstart is quite clear, but I'd love to see some slightly larger examples like, how is state passed between components? How do event handlers work? The API page seems sparse as well. But it looks like a great start
- jorgebucaran 6y agoAnd you'll get it! Just check again soon as we should have the official release out there in just a few months, maybe less.
- AndrewUnmuted 6y agoTo be fair, they did make a pretty deliberate effort to warn visitors that the website is incomplete, with some animated text: > this site is a wip, stay in touch!
- jorgebucaran 6y agoThank you. That's a marquee haha.
- davydog187 6y agoJust use https://preactjs.com/ https://preactjs.com/ and call it a day
- afshinmeh 6y agoI have built https://gridjs.io https://gridjs.io on top of Preact. It's pretty stable and the API is very nice. Supports most events/callbacks that React has (nothing against Hyperapp though)
- k__ 6y agoThis. I like how HyperApp takes this to another level, but the ecosystem of Preact is simply better.
- schwartzworld 6y agothere's a valuable comment if I ever saw one
- ggregoire 6y agoWhat are the caveats? Why doesn't everybody use preact instead of react?
- davydog187 6y agoThere’s not many. I used it for several years on theoutline.com and it was great
- deleted 6y ago[deleted]
- czechdeveloper 6y agoI love it, but I actually stuck with version 1, which was way more intuitive for me. Just a side note, I'm not fulltime front-end, so keeping up with modern frameworks is out of my capacity. It's great for smart components to my standard multi-paged systems, but I used it even for small PWA applications.
- hellcow 6y agoI resisted the change to v2 for a long time. In the end I found that v2's state management is much better, so it might be worth a look for that alone.
- czechdeveloper 6y agoI read about it but it just did not click as V1 did. Also I will not rewrite old code just for sake of change and I want all system to be on same framework if possible. I may actually do my own fork where only difference will be passing root state and root actions in addition to partial ones, which will fix great amount of issues I have.
- hellcow 6y agoAgreed. The lack of lifecycle events in v2 complicates things a great deal for seemingly no reason. Subscriptions and Events are similar enough that they could have become a single thing, instead of having two highly similar but not-quite-the-same things to grok. The tuple syntax it uses is very strange coming from v1. I wish I could call it a strict upgrade instead of saying "some things are worse, but other things are better."
- jorgebucaran 6y agoIt's my fault for not fully understanding the functional universe I was getting into when I first started working on Hyperapp. The latest Hyperapp is more strict, but it's all in good measure. Lifecycle events are impure, that's why they're no-good. I can tell you that Hyperapp is not for everyone. If you want to write pure, immutable, functional JavaScript and think hard about client side app architecture (unidirectional state management, controlled side effects, toggleable subscriptions), then you'll love it. I also suggest looking at Elm while you're at it. If you are looking for a more accommodating, meet-in-the-middle kind of approach where you can mix programming styles, you might be better served by, say, P/React.
- manx 6y agoHow is it 2x faster than react? Where does this claim come from?
- giancarlostoro 6y agoAt 1.7K I'm not surprised by this, and I'm not sure why you would be. React is plenty bloated, not saying it's badly coded, but it's a larger codebase than many other SPA frameworks. This one in particular seems to be using as much of native JS code as possible.
- Lapz 6y agoHaven't seen the numbers but in most benchmarks React.js isn't the quickest.
- DigitalSea 6y agoA lot of other frameworks/libraries are faster than React. I know React used to be touted as the fastest option, but the reality is that it isn't.
- keb_ 6y agoProbably from here: https://krausest.github.io/js-framework-benchmark/current.html https://krausest.github.io/js-framework-benchmark/current.ht... Hyperapp does outperform React in most benchmarks (along with many other frameworks). Not sure how the "2x" was measured, though.
- RyanGoosling 6y agoHow much faster is vanilla DOM API calls compared to all other transient DOM API abstraction libraries?
- Glaeqen 6y agoIt seems that scrolling is somewhat broken. Scroll position under one route affects position in others.
- drcongo 6y agoThat was enough to make me not consider using Hyperapp.
- jorgebucaran 6y agoYeah, the site is a WIP, but that should be fixed soon when V2 is officially out.
- wooolfgang 6y agoLove the website aesthetic!
- bharani_m 6y agoI've used this for building the browser extensions for my app [1]. It is simple, easy to understand and easy to reason with. However, I would recommend this only for small apps. As soon as your app's features/complexity increases, you end up writing a lot of biolerplate code that libraries like Vue or Preact already handle you for. [1] https://www.emailthis.me https://www.emailthis.me
- shash7 6y agoYour open source browser extension framework was really helpful to me a few years ago!
- bharani_m 6y agoGlad you found it useful. I had sort of neglected it for a while, but during the course of the lockdown, I have started working on a major rewrite - replacing Gulp with Webpack, adding support for Edge, etc. Will release it soon :)
- richeyryan 6y agoI haven't used Hyper but I'm looking for something to use for a browser extension I'm making. I'd love to hear what kind of boilerplate you had to write that Vue or Preact handle. It can be hard to see these gaps ahead of time so I'd appreciate the benefit of your experience.
- jorgebucaran 6y agoCurious to hear what boilerplate you think Vue or Preact already handles for you.
- schwartzworld 6y agoWhen last I checked, Hyperapp was basically the elm architecture implemented in JS, a gateway drug.
- k__ 6y agoI had the impression it was the other way around. People starting with Elm, love the idea, but not the ecosystem, and come back to JS in the end. That's how Redux was created.
- queuep 6y agoHaven't been using react because of the JSX, but is this really where we are heading? https://hyperapp.dev/tutorial#rendering-to-the-dom https://hyperapp.dev/tutorial#rendering-to-the-dom Looks like som obfuscated JS-code..
- deergomoo 6y agoWasn't the unwieldiness of render functions the entire reason JSX was created?
- michaelcampbell 6y agoNot sure of the reason, but it's a godsend comparatively. The reaction against JSX I find to be largely by people who've never actually used it. If you keep your components small, as is best practice, whatever gut reaction one feels to it (which IMO is misplaced to begin with) is minimized, and quite readable.
- gnud 6y agoMy big issue with JSX is that it forces you to use a pre-processor and source maps. If you have to do that anyway, I think I could use JSX instead of "pure" JS.
- throwanem 6y agoSetting up Webpack and Babel isn't so bad, these days, and you really only have to do it one time and then you can reuse the setup in other projects. Plus, once you've done it, Typescript is easy to slot in, and that by itself makes the effort worthwhile.
- onetom 6y agoI can highly recommend you watching this talk: https://github.com/matthiasn/talk-transcripts/blob/master/Hickey_Rich/SimpleMadeEasy.md https://github.com/matthiasn/talk-transcripts/blob/master/Hi... It explains very well why is something being easy shouldn't be the main metric, when choosing some technology. In this case you are advocating to pull in webpack (28MB, 348 packages from 210 contributors), @babel/core (12MB, 54 packages from 60 contributors), typescript (53MB, 11 packages, 4 contributors), to just mention the most obvious and necessary dependencies, not even mentioning the different plugins for integrating them with each other, test frameworks, linters, IDEs (syntax highlighting and auto-formatting) and of course the mountains of type definition boiler-plate. 100MB+ of dependencies which are all a responsibility to learn, teach, configure and upgrade. Versus this ~12000 bytes: https://unpkg.com/hyperapp https://unpkg.com/hyperapp It's like 6 pages of code on a 2K iMac monitor and none of the above... I'm not saying that there are circumstances when you might want to put up with all that cost, but have you consciously considered, whether it really worth the overhead? What's missing from hyperapp, which is only present in the 100MB+ deps? Maybe `htm` (1MB, 11 packages, 4 contributors) is a better compromise between bloat and ease of development? And if you are willing to take on the extra dependencies, wouldn't ClojureScript provide a lot lot lot more benefits? It's also based on the super mature Google Closure Compiler, which supports extremely sophisticated optimization techniques and DCE... Just to mention some recent optimization surprise: https://twitter.com/roman01la/status/1277148232276234240 https://twitter.com/roman01la/status/1277148232276234240
- historyremade 6y agoDemocracy in action. Nothing can beat Svelte!
- draw_down 6y ago“The frontend world is constantly churning, it’s impossible to keep up! Anyway, here’s a framework”
- mrozbarry 6y agoBit of a Hyperapp fanboy here, so bare with me. First, I think Hyperapp can make both small and big applications, opposed to u/PufPufPuf's opinion. A lot of people have this opinion because they are more familiar with v1's wired-in actions, which can become quite unruly. In the latest version, actions are decoupled, and can be organized/extracted however you see fit. I've made a handful of applications in both v1 and the current released Hyperapp, and they work very well. If you want to see the latest Hyperapp in action, you can check these out: - A timer for mob programming: https://github.com/mrozbarry/mobtime https://github.com/mrozbarry/mobtime - A canvas game, using Hyperapp for dom/state: https://github.com/mrozbarry/smash https://github.com/mrozbarry/smash - A router for Hyperapp: https://github.com/mrozbarry/hyperapp-router https://github.com/mrozbarry/hyperapp-router I have a handful of older youtube videos regarding v1, you can check them out here: - Intro to Hyperapp (v1): https://youtu.be/uWIyjI8nkz0 https://youtu.be/uWIyjI8nkz0 - Hyperapp (v1) forms and localstorage: https://youtu.be/qpt6aaMxm1E https://youtu.be/qpt6aaMxm1E - Unit testing hyperapps (v1): https://youtu.be/5wvPUj--HaA https://youtu.be/5wvPUj--HaA Note, they are outdated, but there isn't much on youtube about Hyperapp in general. One thing to keep in mind is the naming. A lot of people talk about "Hyperapp" as the first version, and "v2" as the current version, but this is wrong. It's more like "v1" (legacy) and "Hyperapp" (current). It gets confusing, because not everyone is on the same page with that, but this the the naming Jorge (primary author/creator of Hyperapp) has mentioned several times.
- carapace 6y ago( s/bare/bear/ )
- mrozbarry 6y agoYou are absolutely correct!
- franciscop 6y ago> "A lot of people have this opinion because they are more familiar with v1's wired-in actions, which can become quite unruly." u/PufPufPuf only mentions the lack of ecosystem, nothing about the wired-in actions/etc, so it's odd that you defend v1 vs v2 instead of the lack of ecosystem here. This should probably have been a reply to that thread as well because otherwise it's two very unrelated comments in the list.
- bshimmin 6y agoIn the tutorial it says: "In this tutorial we'll stick with `h` to keep it simple and close to the metal." I'm pretty sure they put that in there just to aggravate the HN crowd.
- stepstop 6y agoOr it’s a joke? Assume good intentions
- mrozbarry 6y agoThe `h` function isn't too bad to read if you keep small/manageable components. Obviously, any component, whether JSX or something else, with enough content in it, becomes quite hard to read. Personally, I like using `h` over JSX - JSX can be nice to read, but for people that don't know how it works behind the scenes, it makes things look like magic. Once you know how Hyperapp works behind the scenes, it's much easier to make the decision to JSX if that's something you care about when developing. I have the same opinion about React, and other libraries that have a strong preference to JSX over their native/function implementations.
- reaktivo 6y agoYou might find using htm with hyperapp useful: https://www.npmjs.com/package/htm https://www.npmjs.com/package/htm
- jorgebucaran 6y agoThere's a a JSX-like ttl for Hyperapp too, check it out: https://github.com/zaceno/hyperlit https://github.com/zaceno/hyperlit
- d0m 6y agoI think they use "Close to the metal" as a way to say "Less abstractions"
- deleted 6y ago[deleted]
- aabbcc1241 6y agoNow it looks like Elm
- jorgebucaran 6y agoExactly! And the latest version (which is not officially out yet) is even closer to Elm that the first version ever was.
- oweiler 6y agoI love hyperapp! It has very few concepts to learn, and the source code is less than 500 lines. Sadly its ecosystem is non-existant.
- pgt 6y agoTo me every JavaScript framework feels to me like it wants to reason about components as data, ala Hiccup: https://reagent-project.github.io/ https://reagent-project.github.io/
- jorgebucaran 6y agoReagent is amazing, thank you for sharing it.
- ptu 6y agoI'm a big re-frame fan from the Clojurescript world so this all looks rather familiar. For me it's a great framework and worth learning Clojurescript for. Seeing the h() function makes me realise how much I miss Hiccup syntax for HTML and your component tree, especially with editor support for parens it's a joy. But it looks nicer than JSX. I'm going to give Hyperapp a try, I like the small size aspect especially, and familiarity of the overall architecture, my fear is that if you're going off-piste enough to avoid the React/Angular well trodden track on an app, you might as well go the whole way and use Re-frame which is very pragmatic, with JS interop it's possible to do pretty much anything you want. And whilst the type system and compiler of Elm is nice, the slightly more 'infamous' parts of restrictions to JS extensions make it more limited in the real world.
- ancarda 6y agoJust shows a blank page without JavaScript. Does Hyperapp have any way to render out an HTML fallback if JS doesn't load?
- jorgebucaran 6y agoThat's an issue with the site that'll be fixed when Hyperapp is officially released.
- Shish2k 6y agoBeen using this for a while and loving it - it feels like functional programming for GUIs (“describe what you want the end result to look like, and the framework makes it happen” as opposed to “describe what steps to execute”). I’m pretty sure a lot of frameworks have similar mindsets, but Hyperapp is the one that I found works with the fewest headaches :P (as opposed to eg React, where I spent hours simply trying to untangle the knot of thousands of dependencies before I could get step 1 of the quickstart tutorial to compile...) As an example of how trivial problems require trivial code: https://github.com/shish/divetools2/blob/master/src/screens/mod.tsx https://github.com/shish/divetools2/blob/master/src/screens/... https://scuba.shish.io/#screen=MaxOperatingDepth https://scuba.shish.io/#screen=MaxOperatingDepth
- nailer 6y agoReact was made in 2013 and is pretty old at this point. How does Hyperapp compare to current tech like Svelte?
- onetom 6y agoSvelte is more declarative. Svelte is also a compiler, which generates very efficient code for keeping the dependent parts of the DOM up-to-date when the app state changes, effectively moving the vDOM diffing cost from runtime to compile-time.
- jorgebucaran 6y agoThis deserves a much better answer, but I'll just say this for now. Svelte is declarative/imperative (but mostly imperative) and also not based on functional principles. React is definitely more on the declarative side. And Hyperapp is essentially Elm in JavaScript, so it's as declarative/functional/immutable as the definition allows for. Maybe the person that said Svelte was more declarative was only familiar with an older incarnation of Hyperapp that wasn't completely based on functional principles, or maybe they're using a more loose but inaccurate definition of declarative (kind of like how people often say "theory" when they actually mean "hypothesis").
- RivieraKid 6y agoWhat do you think the advantages and disadvantages are? I remember briefly looking into Hyperapp and mostly liking it, but still wasn't sure which JS framework is the best choice (the other one I liked was Vue). Some time after that I learned about Svelte and very quickly concluded that this would be my choice, everything just feels right about it. For the record, I've only done a small project in Svelte.
- jorgebucaran 6y agoThat's fine. If you're already happy with Svelte, I encourage you to explore more with it. Try building a couple of non-trivial projects and keep learning about your craft. If you're also into computer science, I recommend you look into functional programming if you haven't done so yet. Then look at Svelte again. Try React too. Check out Elm. I can tell you that Hyperapp is not for everyone. If you want to write pure, immutable, functional JavaScript and think hard about client side app architecture (unidirectional state management, controlled side effects, toggleable subscriptions), then you'll love it. If you are looking for a more accommodating, meet-in-the-middle kind of approach where you can mix programming styles, and don't want to think much about those things I mentioned above, then React, Vue, Svelte are all great choices. V2 will be released in a few months, so do circle back to Hyperapp then to see how you like it again.
- loustak 6y agoWhat are the difference with Mithril.js? Both seems to embrace the same philosophy in almost the same way. Or am I missing something?
- jorgebucaran 6y agoThey're similar, but Hyperapp is purely functional and more comparable to Elm.
- mr0010110fixit 6y agoSo I have extensively used hyperapp (1 and 2) for hybrid mobile applications that run the cab of big rigs. We actually won best in show this year at Freight Waves for our two apps. These are medium/larger apps, with lots of functionality, need to hook into native device features (done with ionic capacitor, and custom plugins), and need to be fast, robust, and flexible. Hyperapp has allowed all of those things. Hyperapp can and will work, with larger applications, but hyperapp does not have super strict "guide rails" like other more popular frameworks do, so its up to you to design, and implement a clean code base. It ships with minimum overhead, and you can either roll features you need, or see if someone in the community has created them. I have worked with angular (1,2,4,6) and react for quite a few projects, and I actually work faster, and end up with a better end product using hyperapp. Its an amazing little framework. Sure, not having stricter guide rails you can write very poor apps in hyperapp, it will let you do stuff poorly, but if you play to its strengths, and get comfortable with it, it really shines.
- keb_ 6y agoHey there, really happy to hear of the success you've had with Hyperapp. I've played with Hyperapp v1 in the past for small toy projects, and it was relatively easy to become productive with. I'm wondering if you have any open toy projects or boilerplate you could share for v2, as I'm looking to jump back on it when I get the chance, and would love to see what a scalable project skeleton looks like.
- mr0010110fixit 6y agoI do not have anything that is open as of now (but about to start a new project soon) I would check out https://medium.com/hyperapp/a-walk-through-hyperapp-2-b1f642fca172 https://medium.com/hyperapp/a-walk-through-hyperapp-2-b1f642... to get your toes wet though, good resource, also feel fee to join the hyperapp slack https://hyperappjs.herokuapp.com/ https://hyperappjs.herokuapp.com/ nice community and super helpful.
- WA 6y agoWhy didn’t you go with Ionic or Stencil? Did you roll your own design?
- ehutch79 6y agoThis page does not inspire confidence in the framework. I don't need a non-ui piece of software to have the slickest site... but no lorem ipsum please.
- jorgebucaran 6y agoI put it there, so I apologize for it. We were in the middle of a rewrite while working towards the official V2 release and weren't expecting to be on HN right now haha. Thanks for chipping in!
- ehutch79 6y agoOuch. that's rough. I've seen some incidents before where backend frameworks were posted before they had things like authentication ready.
- deleted 6y ago[deleted]
- jhardy54 6y agoBlank page when JS is disabled. :/
- shroom 6y agoDang, I registered hyperapp domain because I thought it was a good name and wanted to build something cool there. Like all side projects it’s not about the idea but the execution. I’ll put this in my bin together with slackday (Should have registered slack:) On topic: This looks interesting and I Will be giving it a try. Well done!
- jorgebucaran 6y agoDo you happen to own hyper.app?
- Nijikokun 6y agoLooks like mithril
- wackget 6y agoDoes modern web development just completely abandon the idea of "separation of concerns"? Looks like content is freely mixed with markup and logic and results in a horrible, difficult-to-read mess of code.
- disqard 6y agoIMHO, yes. This is why some folks (like myself) find it hard to wholeheartedly embrace JS for building entire apps.
- SPascareli13 6y agoThe idea now is not to separate thing by file type (all .js go here, html goes there) but to separate by logical components, thing that work together, go together. I guess it's like working in vertical slices of related logic rather than layers with logic and layers with markup and such. That has its problems tho, that for sure.
- mrozbarry 6y agoWhat code are you referring to? Hyperapp has clear separation of presentation, logic, and side-effects. Of course, developers can choose to keep that a clean and distinct separation, or let a bunch of code inter-mingle.
- Kiro 6y agoThere has never been any separation of concern in web development. Just because you put your scripts, HTML and CSS in different files doesn't mean they are separated.
- wackget 6y agoIsn't that the definition of separated? If you want to edit content or markup, you open the HTML file. If you want to edit business logic, open PHP or JS. And so on.
- ng12 6y agoYeah but then your JavaScript spews out unholy tendrils that mutate the DOM and dynamically add/remove CSS classes and style attributes. Separating HTML/CSS/JS made a lot of sense for web sites but separating by component makes more sense for web applications.
- joelbluminator 6y agoHow does this compare to Stimulus?
- jorgebucaran 6y agoStimulus is not so much concerned with rendering HTML. Hyperapp is almost exclusively focused on rendering HTML and client side application architecture (state management, controlled side effects, subscriptions). It's more comparable to Elm than React, Vue, Angular, Svelte, etc., since it's based on functional principles and you can only write pure, immutable code.
- beders 6y agoSomeone got inspired by re-frame, I see :) I like the approach. Wondering if there's a way to get ever closer to hiccup (without having to resort to JSX) Also, letting the framework decide if a function inside the markup should be called or not gives opportunity for more optimizations that go beyond VDOM diffing. That would require an even more declarative approach. i.e. [h1, {}, [MyComponent, {}]] vs. h("h1", {}, MyComponent({})) If the framework figures out that MyComponent wasn't changed, it can re-use the VDOM nodes.
- jorgebucaran 6y agoYep, there's a feature called Lazy (will be renamed to memo for the official release) that allows you to do just that! :)
- RyanGoosling 6y agoJust another transient DOM API abstraction library
- WealthVsSurvive 6y agoAlmost like the DOM Web API isn't useful for its intended purpose anymore and should be replaced or built upon to avoid all this abstraction churn. Why is simplicity the enemy of the Web APIs? Why is everything useful left to user-defined dependencies? Are the spec creators even checking to see what their code looks like when people have to cobble it together to create something useful? I suspect they are NOT.
- jorgebucaran 6y agoHyperapp only makes sense if you want to write immutable, purely functional SPAs in JavaScript. There's no Web API or native abstraction for that. And if your site was only content, then I'd say why even bother with JavaScript.
- WealthVsSurvive 6y agoOkay, so there's no Web API or native abstraction for what? Immutability? There is, but it's somewhat semantically obtuse to express natively with Object freezing, not even to mention some other variably-efficient jiggery-pokery with proxies or something (or maybe there's a new language feature for this that I've forgotten about, so many after all, or was it a proposal?). Purely functional single-page application: oof, such a mouth-full. Can mean so many things too. So this entire new abstraction is for a front-loaded SPA? Maybe the Web should be reinvented, slightly at least. Maybe it would be a good thing if Web Assembly in conjunction with HTTP3 or something akin to it ate the whole beast, ecmascript and all.
- jorgebucaran 6y agoJust saying "purely functional SPAs" was lazy, but it's usually enough to convey what makes Hyperapp different from other frameworks like React, etc. Let me try harder. There's no native API for representing apps as finite-state-machines (Moore style) [1]. Admittedly, we could do a better job at explaining why you should care. Hyperapp actions (Elm messages) correspond directly to FSM "events". Hyperapp effects (Elm commands) correspond directly to FSM "actions". The "single-global-state" corresponds to the fact that an FSM is always in just one of a number of "states". Hyperapp is FSM architecture for JavaScript apps. It is also bundled with a VDOM implementation optimized for immutability, e.g., you must derive your UI from the state, can't produce uncontrolled side effects, and can't use traditional DOM events, instead you think of every UI interaction as a state transition. One more cool thing about Hyperapp is subscriptions. An abstraction to toggeable event streams: think bidirectional effects, e.g., global mouse/keyboard events, time, animation frames, geolocation. [1]: https://en.wikipedia.org/wiki/Moore_machine https://en.wikipedia.org/wiki/Moore_machine
- dang 6y agoIf curious see also 2018 https://news.ycombinator.com/item?id=17126670 https://news.ycombinator.com/item?id=17126670 2017 https://news.ycombinator.com/item?id=15467819 https://news.ycombinator.com/item?id=15467819 2017 https://news.ycombinator.com/item?id=15264053 https://news.ycombinator.com/item?id=15264053 2017 https://news.ycombinator.com/item?id=15178535 https://news.ycombinator.com/item?id=15178535 2017 https://news.ycombinator.com/item?id=14629414 https://news.ycombinator.com/item?id=14629414
- jczhang 6y agoso.. a lighter react?
- jorgebucaran 6y agoPreact would be the lighter React. Hyperapp is more comparable to Elm.
- recursive 6y agoI wish people would stop demonstrating new languages or frameworks using fonts with ligatures. "Surely, you couldn't use an actual arrow here... right?" I find myself having to copy and paste the text to find out for sure.
- apolymath 6y agoHTML should be created by WRITING HTML! WTF is your malfunction? Javascript should ALWAYS be as minimal as possible on your web page. We aren't building a native app! THIS IS THE WEB!!!!!