slavafomin/redirect.html

## redirect.html
<!doctype html>

<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Cache Test Redirect</title>
</head>

<body>

    <script type="application/javascript">
        (() => location.href = '/test.html')();
    </script>

</body>
</html>

## test.html
<!doctype html>

<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Cache Test</title>
    <style>
        #resources-container {
            display: flex;
            flex-wrap: wrap;
        }
        img {
            width: 100px;
            height: 100px;
            margin: 5px;
        }
    </style>
</head>

<body>

    <div>
        <button type="button" id="load-resource-button">Load Resource</button>
        <button type="button" id="fetch-resource-button">Fetch Resource</button>
        <label>
            <input type="checkbox" id="disable-cache-checkbox">
            Disable Cache
        </label>
    </div>

    <p>
        <a href="/redirect.html">Redirect Me</a>
    </p>

    <hr>

    <div id="resources-container"></div>

    <script type="application/javascript">
        (() => {
            const IMAGE_URL = '/image.jpg';

            const container = document.getElementById('resources-container');
            const loadButton = document.getElementById('load-resource-button');
            const fetchButton = document.getElementById('fetch-resource-button');
            const disableCacheCheckbox = document.getElementById('disable-cache-checkbox');

            loadButton.addEventListener('click', () => {
                const t0 = performance.now();
                const image = document.createElement('img');
                image.src = '/image.jpg';
                image.addEventListener('load', () => {
                    const t1 = performance.now();
                    console.log('Image loaded in: ' + (t1 - t0) + ' ms.');
                });
                container.append(image);
            });

            fetchButton.addEventListener('click', () => {
                const t0 = performance.now();
                const cacheDisabled = disableCacheCheckbox.checked;
                const fetchConfig = {
                    cache: (cacheDisabled ? 'no-store' : 'default')
                };
                fetch(IMAGE_URL, fetchConfig).then(response => {
                    if (!response.ok) {
                        throw new Error(`Failed to load the resource`);
                    }
                    response.blob().then(blob => {
                        const image = document.createElement('img');
                        image.src = URL.createObjectURL(blob);
                        image.addEventListener('load', () => {
                            const t1 = performance.now();
                            console.log('Image loaded in: ' + (t1 - t0) + ' ms.');
                        });
                        container.append(image);
                    });
                });
            });

        })();
    </script>

</body>
</html>
	<!doctype html>

	<html lang="en">
	<head>
	<meta charset="utf-8">
	<title>Cache Test Redirect</title>
	</head>

	<body>

	<script type="application/javascript">
	(() => location.href = '/test.html')();
	</script>

	</body>
	</html>