PURE CSS ART GALLERY

Loading artwork...

Lynn Fisher

lynnandtonic.com

Normally I illustrate with a single div, but this one has 50! Whew.

Edit on Codepen

Async `<link>`

Total

…s

Download

Start: …ms

Duration: …ms

Render

Start: …ms

Duration: 1…ms

localStorage

Total

…s

Download

Start: …ms

Duration: …ms

Render

Start: …ms

Duration: 1…ms

Cache-API

Total

…s

Download

Start: …ms

Duration: …ms

Render

Start: …ms

Duration: 1…ms

Browser	OS	Async	localStorage	Cache-API	Tests	Improvement
Chrome 97.0	Windows 10 64-bit	192.54ms	3.60ms	8.52ms	5	-
Chrome 100.0	Windows 10 64-bit	302.58ms	7.83ms	22.73ms	4	-
Safari 15.1	OS X 10.15.7	126.50ms	2.50ms	21.50ms	2	-
Chrome 97.0	OS X 10.15.7 64-bit	336.30ms	4.30ms	7.10ms	2	-
Chrome 98.0	OS X 10.15.7 64-bit	398.25ms	3.00ms	6.40ms	2	-
Chrome 99.0	OS X 10.15.7 64-bit	452.50ms	2.90ms	3.80ms	2	-
Firefox 97.0	Windows 10 64-bit	192.50ms	8.00ms	19.00ms	2	-
Opera 83.0	Windows 10 64-bit	291.60ms	15.55ms	13.50ms	2	-
Firefox 100.0	Windows 10 64-bit	211.50ms	4.50ms	9.50ms	2	-
Chrome 100.0	OS X 10.15.7 64-bit	319.85ms	3.80ms	11.40ms	2	-
Android Browser 4.0	Android 11	913.70ms	32.20ms	72.20ms	1	-
Chrome 87.0	Linux 64-bit	242.29ms	3.39ms	5.11ms	1	-
Firefox 89.0	Ubuntu 64-bit	827.00ms	10.00ms	15.00ms	1	-
Chrome 96.0	OS X 10.15.7 64-bit	448.50ms	6.00ms	9.20ms	1	-
Chrome 96.0	Windows 10 64-bit	533.10ms	2.60ms	5.10ms	1	-
Chrome 98.0	Windows 10 64-bit	443.20ms	7.70ms	19.10ms	1	-
Opera 82.0	Windows 10 64-bit	293.90ms	5.00ms	11.40ms	1	-
Chrome 97.0	OS X 10.14.1 64-bit	272.40ms	5.60ms	10.30ms	1	-
Firefox 96.0	Ubuntu 64-bit	274.00ms	13.00ms	22.00ms	1	-
Chrome 99.0	Windows 10 64-bit	194.40ms	2.50ms	8.30ms	1	-
Chrome 101.0	Windows 10 64-bit	417.90ms	4.30ms	9.00ms	1	-