Challenges for Developers of Building Large Web Applications
summary
Financial Times moves its core mobile experience to app.ft.com and reports concrete fixes: use browserify + npm for encapsulation and repeatable builds plus npm shrinkwrap and a private cache, name CSS classes as component_prefixed tokens to avoid leakage, aim for 60fps (16.6ms budget) by avoiding relayout/paint and animating with translate/scale/opacity and translateZ, batch DOM reads/writes with fastdom, replace AppCache/localStorage/IndexedDB quirks with an eventual service worker strategy and open source ft-scroller for momentum touch.
AI-written summary · about
chapters (17)
- 0:00Start
- 7:52CommonJS Spec
- 9:56npm + browserify
- 11:58It's not perfect (yet...)
- 18:30Perils of a single thread
- 20:03Consistent frame rate
- 20:38What happens on this thread?
- 22:33Use animation
- 26:22Reducing relayout
- 27:17Batch DOM read/writes
- 29:47Client Side Storage Options
- 30:22AppCachee
- 31:57Faster than cache...
- 32:26LocalStorage
- 33:32IndexedDB
- 34:44Future: Service Worker
- 37:07A quick recap....
related talks
56mMaking Web Apps as Smooth as Native
33mWeb performance in large-scale applications
31mMobile-friendly web apps with Angular
42mBuilding quick apps in 2018
32mMake Websites, Not Apps
29mSpeeding up Without Slowing down
51mScale and adapt: A story of how we built Responsive BBC News
32mPractical Performance Tips Building Progressive Web Apps