Michael Scharnagl justmarkup

Use responsive images
Inline critical CSS (if the CSS is <50k probably worth inlining everyhing)
Use a web font loading strategy, eg. https://www.filamentgroup.com/lab/font-events.html
Configure your server to handle gzip, etags... correctly https://github.com/h5bp/server-configs-apache
Load JavaScript async
Use a CDN (be sure to think about fallback scenarios)
Use Service Worker

Thoughts about a way to progressive enhance the technique to control CSS loading by Jake Archibald.

My idea was to set a class for html (which gets changed if custom properties are supported) and in the CSS use:

.no-ccp footer {
  display: block;
}

footer {

	# Test 1:

	1) Cloned the repo
	2) Started Server via
	```
	npm install http-server -g
	http-server -c-1
	'''
	3) Opened page https://localhost:8080/
	4) Reloaded - got console message "This page is controlled by a ServiceWorker"

	Request URL:http://localhost/sw/2/simple-serviceworker-tutorial/script.js
	Request Method:GET
	Status Code:200 OK (from ServiceWorker)
	Request Headers
	Provisional headers are shown
	Accept:text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,/;q=0.8
	User-Agent:Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/40.0.2214.111 Safari/537.36
	Response Headers
	accept-ranges:bytes
	content-encoding:gzip

	Remote Address:127.0.0.1:80
	Request URL:http://localhost/sw/2/simple-serviceworker-tutorial/script.js
	Request Method:GET
	Status Code:200 OK
	Request Headersview source
	Accept:text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,/;q=0.8
	Accept-Encoding:gzip, deflate, sdch
	Accept-Language:en,en-US;q=0.8,de-DE;q=0.6,de;q=0.4
	Cache-Control:no-cache
	Connection:keep-alive

	IE7
	hyphens -
	word-break +
	overflow-wrap +
	hyphens + word-break combined -
	hyphens + overflow hyphens combined +

	IE8
	hyphens -
	word-break +

	<script>
	if (navigator.serviceWorker) {
	navigator.serviceWorker.register('./serviceworker.js', {
	scope: './'
	});
	}
	</script>