voxpelli/README.md

## README.md

      
    Raw
  

              README.md
            
          
    Test case for duplicate downloads of Link Preloads


Download package.json and single-preload.js and put into same folder
Run npm install
Run node single-preload.js
Visit http://127.0.0.1:4000/ using Safari Technology Preview 24 with the Link Preload  experimental feature activated
Check the Network tab of the web development tools. See two style.css that's loaded


## package.json
{
  "name": "preload-testcase",
  "version": "1.0.0",
  "description": "",
  "main": "single-preload.js",
  "author": "Pelle Wessman <pelle@kodfabrik.se> (http://kodfabrik.se/)",
  "license": "MIT",
  "dependencies": {
    "express": "^4.14.1"
  }
}

## single-preload.js
'use strict';

const app = require('express')();

app.get('/style.css', (req, res) => {
  res.type('css');
  res.send('body { background: blue; }')
});

app.get('/', (req, res) => {
  res.set('Link', '</style.css>; rel=preload; as=style');
  res.send(`<!DOCTYPE html>
    <html id="root-element" class="no-js">
      <head>
        <meta charset="utf-8" />
      <link rel="stylesheet" href="/style.css" />
      </head>
      <body>
        <h1>Single preload</h1>
        <p>Test case to detect double loading resource through rel-preload</p>
      </body>
    </html>
  `);
});

app.listen(4000, function () {
  console.log('Example app listening on port 4000!')
});
	{
	"name": "preload-testcase",
	"version": "1.0.0",
	"description": "",
	"main": "single-preload.js",
	"author": "Pelle Wessman <pelle@kodfabrik.se> (http://kodfabrik.se/)",
	"license": "MIT",
	"dependencies": {
	"express": "^4.14.1"
	}
	}
	'use strict';

	const app = require('express')();

	app.get('/style.css', (req, res) => {
	res.type('css');
	res.send('body { background: blue; }')
	});

	app.get('/', (req, res) => {
	res.set('Link', '</style.css>; rel=preload; as=style');
	res.send(`<!DOCTYPE html>
	<html id="root-element" class="no-js">
	<head>
	<meta charset="utf-8" />
	<link rel="stylesheet" href="/style.css" />
	</head>
	<body>
	<h1>Single preload</h1>
	<p>Test case to detect double loading resource through rel-preload</p>
	</body>
	</html>
	`);
	});

	app.listen(4000, function () {
	console.log('Example app listening on port 4000!')
	});