this post was submitted on 29 Jun 2024
86 points (95.7% liked)
Programming
16975 readers
1288 users here now
Welcome to the main community in programming.dev! Feel free to post anything relating to programming here!
Cross posting is strongly encouraged in the instance. If you feel your post or another person's post makes sense in another community cross post into it.
Hope you enjoy the instance!
Rules
Rules
- Follow the programming.dev instance rules
- Keep content related to programming in some way
- If you're posting long videos try to add in some form of tldr for those who don't want to watch videos
Wormhole
Follow the wormhole through a path of communities [email protected]
founded 1 year ago
MODERATORS
you are viewing a single comment's thread
view the rest of the comments
view the rest of the comments
I wish we went the other way around: build for native and compile to HTML/CSS/WASM.
For me the disadvantage of Electron is well, it doesn't have any advantage or performance improvement over the browser version for 99% of use cases, and when you shove that on a mobile phone it performs as horribly as the web version.
People already use higher level components that ends up shitting out HTML and CSS anyway, why not skip the middleman and just render the box optimally from the start? Web browsers have become good, but if you can skip parsing HTML and CSS entirely and also skip maintaining their state, that's even better.
I had the misfortune of developing a React Native app, and I'd say thinking in terms of rows and columns and boxes was nice. Most of RN's problems are because they still run JS and so you have to bundle node and have the native messaging bridge, and of course that it's tied to the turd that is React. But zero complains about the UI part when it doesn't involve the bridge: very smooth and snappy, much more than the browser. And the browser version was no different than standard React in performance.
I like that it's not yet another Chromium one at least.
There are several issues with native development without a browser layer.
First of all, native UI toolkits are very different and making a robust cross platform app is pretty much impossible. So, the traditional approach is to use one toolkit, which will be native to one platform, and then let your other users deal with it. For example, GTK apps on Windows and Mac look and feel like shit.
Another approach is to use a custom cross platform toolkit, which doesn't use anything native at all. If enough work and thought is put in such application, it can be a very pleasant experience. But often it's shit for all users.
The second issue is that it can be quite hard to manage fluid window sizes and to build a proper responsive UI with native toolkits. Some are better at it, some are worse. Native toolkits also tend to punish developers for deep nesting of components making UI development even more painful.
HTML + CSS solves all that. It's responsive by design, everyone is used to web apps already, nesting is not a problem at all, etc.
I'm not saying to use native toolkits like Qt or GTK, those indeed have problems. What React Native does is somewhere in-between: it's an abstraction that produces decent results between platforms including the web.
It uses slightly higher level abstractions that work a lot like the web for rendering, you still get your boxes and a subset of CSS properties. But on web it'll compile to flexbox or grids, on Android it'll compile to something like a LinearLayout or some other kind of layout the OS understands. On web a
<Text>will compile to a<span>, on Android it'll compile to a native text element. On mobile where you need the performance the most, you otherwise end up rendering a web page that will then eventually end up doing the same thing back to display it natively, but with all the downsides of a web view.This performs way better with basically no downside for the web version, has the majority of the flexibility one needs for responsive layouts but it's way more lightweight when you do target native. On native you can just render it all yourself for really cheap, like any native toolkit would. You're your own toolkit.
They will never look native, but at least all the rendering will be native. Most companies have their custom UI theme anyway, native widgets rarely gets used anyway.
We're talking Electron replacement after all, it's not like apps made with it look anything native. But if at least they performed like native apps by skipping the web views and all the baggage it brings with it, that'd be great.
I know how React Native works and it doesn't fix anything. For example, if the underlying toolkit punishes you for deep nesting - you're still fucked. Google recommends to have 10 or less levels of nesting, which is bonkers to any web developer. There is similar advice for iOS, Mac and Windows (not sure about GTK and Qt, haven't used them for over a decade). Each platform has its own solution, so you end up with custom code for each and at that point or doesn't matter if you're coding in C or JS.