wooorm / dictionary

Dictionary app that can work without JavaScript or internet

dictionary

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

Size

• 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)

Performance

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

Build

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=1234567890qwertyuiopasdfghjklzxcvbnm1234567890qwer

Then, run npm install and npm build to build everything.

Lastly, run npm start to start the server on port 2000.

To do

• HTTP/2: I was just trying this out locally, so idc.
• Manifest icons: I don’t have an Android, so idc.

License

MIT © Titus Wormer