Skip to content

Instantly share code, notes, and snippets.

View OttoH's full-sized avatar
🐱

otto huang OttoH

🐱
View GitHub Profile

Route-based chunking

Many of us building single-page apps today use JavaScript module bundling tools that trend towards a monolithic "bundle.js" file including the full app and vendor code for multiple routes. This means if a user lands on any arbitrary route they need to wait for a large bundle of JS to be fetched, parsed and executed before the application is fully rendered and interactive.

screen shot 2016-09-28 at 4 45 52 pm

This is a little backwards, especially when apps are used under real-world network (3G) and device

<!DOCTYPE html>
<html>
<head>
<title>Nautilus of justangon</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="description" content="justangon's blog">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.5.0/pure-min.css"-->
<link rel="stylesheet"href="https://cdn.jsdelivr.net/pure/0.6.0/pure-min.css">