"Building Fast Webapps, Fast, Lessons From Creating the Meebo Bar"
summary
Meebo Bar runs on >6,000 sites and reaches ~100M monthly users; embed bootstrap is ~10ms, ~12,200 characters and never depends on the provider server. Core tactics: load payloads into a same‑domain iframe by writing HTML then calling document.close, append scripts into the iframe head to avoid render and onload blocking; defer work with event‑delegation (mousedown) to cut O(nm) scans to constant onload; use data: URIs/MHTML for CSS images, SVG/VML for UI, localStorage for script caching*, plus profilers and Closure Compiler (simple optimizations).
AI-written summary · about
chapters (18)
- 0:00Intro
- 0:37The Meebo Bar A customizable site bar with real-time social interaction
- 1:05Meebo Bar, a 3rd Party Webapp JavaScript, CSS, Images & HTML
- 1:583rd Party Webapps The Challenge
- 2:283rd Party Webapps: How? Tools
- 5:13Meebo Bar embed code
- 5:54Initializing 3rd Party Webapps
- 8:02Accepted script loading code
- 8:20Don't block the page!
- 9:40Iframed JS - the solution
- 13:40Defer Execution Example In-page sharing
- 15:34Naive implementation
- 16:46Deferred implementation
- 18:29Modularize & Lazy Load
- 19:35Loading Images
- 20:41Use Vector Graphics
- 21:32Tools - use them!
- 22:49Perceived Performance
related talks
42mBuilding quick apps in 2018
41mHigh Performance Kick-Ass Web Apps
49mUX Patterns for Web Developers
25mBetting on the web: Ensuring fine-tuned performance for dynamic web apps
30mWeb runtime performance
32mApproach to the Fastest Possible Time-to-Interactive
31mJS in Extreme Conditions: WebApps for the Refugee Aid Movement
39mGiving you ways to increase, but also explain site performance, to your boss.