
Show HN: TS LiveView - aabbcc1241
https://github.com/beenotung/ts-liveview
======
aabbcc1241
LiveView enables rich, real-time user experiences with server-rendered HTML.

So you can write complex realtime webapp without bloating the client side. It
responses pre-rendered HTML upon first GET request, then use websocket to
patch the DOM for later interactions.

Just like Phoenix LiveView but in Typescript!

------
aabbcc1241
The core library only consist of 441 LOC (excluded types and imports). Plus
most logics are shifted on the server side, hence only minimal works is
required on the client side.

I made this tool because I was frustrated by the initial load time for an
Ionic 4 app, and the deep 'DOM expansion' after the web components got
mounted.

~~~
aabbcc1241
LiveView is very lightweight, the client-side js (liveview + morphdom) is only
8K minified. For reference, a blank Ionic Angular build is 4.2M

Below are more size comparison:

| Tools | Runtime Code Size (minified) |

|----------|------------------------------|

| TS LiveView + morphdom | 8K |

| (Phoenix) LiveView.js + morphdom | 29K |

| Vue 2.5.20 | 88K |

| React 16.6.3 + React DOM | 112K |

| Ember 3.0.0.beta.2 | 468K |

| React + Ionic * | 2.1M |

| Stencil + Ionic * | 3.0M |

| Angular + Ionic * | 4.2M |

* : all Ionic build excluded the svg, assets, *.map and PWA json files

