add client-side preloading logic, move router into runtime module

runtime/router.js

@@ -0,0 +1,25 @@
+const router = {
+	init(callback) {
+		console.log('initing');
+		window.addEventListener('click', event => {
+			let a = event.target;
+			while (a && a.nodeName !== 'A') a = a.parentNode;
+			if (!a) return;
+
+			if (callback(new URL(a.href))) {
+				event.preventDefault();
+				history.pushState({}, '', a.href);
+			}
+		});
+
+		window.addEventListener('popstate', event => {
+			callback(window.location);
+		});
+
+		callback(window.location);
+	}
+};
+
+window.router = router;
+
+export default router;

templates/main.js

@@ -1,22 +1,9 @@
-window.addEventListener('click', event => {
+import router from 'sapper/runtime/router.js';
-	let a = event.target;
-	while (a && a.nodeName !== 'A') a = a.parentNode;
-	if (!a) return;
-
-	if (navigate(new URL(a.href))) {
-		event.preventDefault();
-		history.pushState({}, '', a.href);
-	}
-});
-
-window.addEventListener('popstate', event => {
-	navigate(window.location);
-});
 
 const target = document.querySelector('__selector__');
 let component;
 
-function navigate(url) {
+router.init(url => {
 	if (url.origin !== window.location.origin) return;
 
 	let match;
@@ -24,6 +11,11 @@ function navigate(url) {
 	const query = {};
 
 	function render(mod) {
+		const route = { query, params };
+
+		Promise.resolve(
+			mod.default.preload ? mod.default.preload(route) : {}
+		).then(preloaded => {
 			if (component) {
 				component.destroy();
 			} else {
@@ -32,14 +24,13 @@ function navigate(url) {
 
 			component = new mod.default({
 				target,
-			data: { query, params },
+				data: Object.assign(route, preloaded),
 				hydrate: !!component
 			});
+		});
 	}
 
 	// ROUTES
 
 	return true;
-}
+});
-
-navigate(window.location);