Dictionary app that can work without JavaScript or internet.
- Works without JavaScript
- Works offline: Service worker,
pouchdb - Server:
express - Rendering:
virtual-dom - 100/100 on Lighthouse when ignoring HTTP/2 support, 88/100 otherwise
- Shared rendering across server and app
- Data from Words API
- Caches Words API responses in
levelup
- CSS: 1.49 kb GZipped (written for modern browsers w/o prefixed though)
- JS: 46.6 kb GZipped (mostly
pouch) written in ES5 - HTML: 2.17 kb GZipped (small, 1 entry), 4.26 kb GZipped (large, 21 entries)
Loading /dictionary afresh (first load) transfers 114 kb (app itself, and
initialising the service worker cache).
| Connection | DOMContentLoaded |
|---|---|
| GRPS | 10.22s |
| Good 2G | 1.39s |
| Good 3G | 447ms |
| Regular 4G | 221ms |
| Wifi | 145ms |
git clone, then configure a .env file with a
WORDSAPI_KEY. Words API is free up to 2500 request per day,
which is more than enough for trying this out.
For example, .env would looks as follows:
WORDSAPI_KEY=1234567890qwertyuiopasdfghjklzxcvbnm1234567890qwerThen, run npm install and npm build to build everything.
Lastly, run npm start to start the server on port 2000.
- HTTP/2: I was just trying this out locally, so idc.
- Manifest icons: I don’t have an Android, so idc.