YHK - yet another hacker news clone

Show HN: JavaScript web apps with WASM layout and GPU rendering in 280 KB

28 points rkaehn 2 days ago 12 comments

Over the past year, I have been working to find a better way to write cross-platform apps.

The problems I am trying to solve:

- Native frameworks only work on a subset of platforms, so a different implementation of the UI needs to be written per target. - They are updated at the same pace as the platform itself, which forces the developer to split the user base to be able to use new features, or wait a long time for bugs to get fixed. - They also force developers to use specific high-level languages, so they are not a good fit for apps with high performance requirements, like creative apps or games. - Cross-platform frameworks that rely on bundling a browser engine solve the problem of code reuse, but they inherit the limitations of HTML/CSS. - Those that take control over layout and rendering are not efficient and lightweight enough to be used on the web, and require the use of compiled languages.

Ideally, we would be able to bundle the UI framework directly with the application. This would allow developers to use new features and fix issues in the UI framework immediately. It would also allow ideas for improvements to compete in a natural way, rather than being decided by a committee.

Uniform is my idea for how we can solve these problems. This is the structure:

- A layout and rendering engine written in C, compiled to WASM on the web and native code on all other platforms - A JavaScript API where each function call gets forwarded directly into the core, for best performance and efficiency - A native runtime (<2 MB) that makes it possible to run the same JavaScript code on macOS and iOS (more platforms to come). The runtime can also generate packaged apps to upload to app stores. The packaging steps are also described in JS.

Uniform supports very fast iteration cycles via hot-reload on all platforms. Even on iOS, the JS source code of an app can be changed while the app is running. Changes are visible on the next display refresh. No connection to a computer or the internet is required. Apps can be written from scratch on a phone, with native performance.

The readme in the linked repository includes many examples and a detailed explanation of the core ideas. It is handwritten without any use of AI.

And here is a live demo: https://raffk.com/hn-demo/

It should work in any browser that supports WebGPU. (To get 120 Hz support in Safari, the “Prefer Page Rendering Updates near 60fps” feature flag needs to be disabled.)

socalgal2 5 hours ago | parent

The problem here is all the OS features are discarded. Can't insert password from password manager because to do so the page would need to access to passwords. Can't use the user dictionary because to do so would be a privacy issue. Doesn't support CJK and other languages that require an input method editor. etc....

It also means a platform's features are not duplicated so your app's behavior sticks out as having a different experience from everything else the user does making it frustrating.

That said, if you want see an app in WebGL/WASM where the browser is rendering everything there's https://earth.google.com as a high end example. It has most of the issues just mentioned as well as the fact that nothing is selectable by default. Want to copy a name so you can paste it into your search engine of choice. NO! Want to right click on a foreign name to find out how to pronounce it? NO! etc....

mkl 5 hours ago | parent

The name seems very un-searchable and already overused (I found several other web Uniforms while testing searching for yours, which I didn't find). The demo seemed low framerate or something on Chrome Android, and apparently my main, Firefox Android, doesn't support WebGPU by default.

pmkary 5 hours ago | parent

I have been dreaming about this for ages, ditching the DOM and building everything in WASM for example. This is insanely great.

bschwindHN 2 hours ago | parent

It seems insanely...bad to me. I loaded the HN demo. I can literally see the rows of items loading as if I'm on dial-up.

I can't select any of the text on the homepage demo. In the comments page, text selection doesn't behave like I would expect, in too many ways to describe here.

I right click and can't do anything, unless I right click on an item. And then my only options are "Open", "Open in New Tab", and "Copy Link".

The scrolling on the page doesn't have the normal rebound that you get when you try to scroll past the extents of the page on a trackpad.

Pinch to zoom doesn't work.

Cool that it's handwritten and that you can hot reload and write it on a phone, but as an end user I would _hate_ if I was asked to use an application built on this.

feverzsj 4 hours ago | parent

That's exactly what companies want: truly closed-source website.

idle_zealot 2 hours ago | parent

Surely you could ask Claude to decomp the WASM blob it sends you (lol).

Tepix 3 hours ago | parent

Cool hack. But taking a step back:

Why did you write a layout and rendering engine to run on a browser, which is a layout and rendering engine already? As socalgal2 points out, you’re losing many important features.

anilgulecha 2 hours ago | parent

This is a good experiment. What does it take to have a wasm powered corss platform architecture for apps. So far tauri had done something, but requires a humongous backend (system webview).

If we can reach this goal in under 1mb or 2, this is a massive improvement to the SoTA. Experiments such as these are what get is there. kudos.

onion2k 2 hours ago | parent

What this needs is a demo of something that you can't do natively in a browser. Recreating HN is great, but it shows why it's not as good as HTML+CSS (slower, bigger, no native browser features). This sort of project has the potential to really demonstrate the power of WASM and WebGPU, but in something that's not a game.

You say frameworks "inherit the limitations of HTML/CSS", so show something that can be done when you don't have those limits.

andreapaiola 1 hour ago | parent

Firefox on Android... Not supported

small_scombrus 53 minutes ago | parent

Firefox in general I think because same on Linux

xeonax 1 hour ago | parent

This is the future for ads. no inspect element to zap an ad.