Skip to content

Demonstration of Preact used to build Hacker News as a PWA.

License

Notifications You must be signed in to change notification settings

kristoferbaxter/preact-hn

Repository files navigation

Preact Hacker News Example

See this application live at: https://hn.kristoferbaxter.com

This is an example of a PWA built using Preact, Webpack, and some small opinions. Please do not think of this as the way to build your application. Instead, view this as an example of some concepts used in modern web applications (sw, h2, h2push).

Made with kindness in California. 🏄

Installation

  1. Install yarn
  2. Install h2o Proxy (to allow for local h2 and h2 push)
    • Depends on your OS. Tend to use 'brew' on MacOS -- 'brew update; brew install h2o'
  3. Install Brotli and Zopfli CLI
  4. Install Yarn Dependencies
    • yarn install
  5. Run Locally
    • yarn start (chrome only)
    • yarn bundle:prod; yarn run start (all browsers)
  6. Access using your favorite browser

Details

I've focused mostly on first initial load performance, with the small caveat of using Webpack instead of Rollup. I'd like the route based code splitting to provide a extensible model for keeping initial view rendering costs low.

In the future there are plenty of things to do:

  1. Write a Webpack plugin to allow for split css files based on packages.
  2. Internationalization/Localization, including RTL layout.
  3. Support AppCache (even though it's kind of a jerk)
  4. Allow for posting comments!
  5. FIX LOTS OF BUGS! ZOMG SO MANY BUGS!

About

Demonstration of Preact used to build Hacker News as a PWA.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 4

  •  
  •  
  •  
  •