1<!DOCTYPE html> 2<title>CanvasKit Web Worker Demo</title> 3<meta charset="utf-8" /> 4<meta http-equiv="X-UA-Compatible" content="IE=edge"> 5<meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 7<style> 8 canvas { 9 border: 1px dashed grey; 10 } 11 12 .canvas-container { 13 float: left; 14 } 15</style> 16 17<body> 18 <h1>CanvasKit in a Web Worker demo</h1> 19 <p>NOTE: this demo currently only works in chromium-based browsers, where 20 <a href="https://developer.mozilla.org/en-US/docs/Web/API/OffscreenCanvas#Browser_compatibility"> 21 Offscreen Canvas 22 </a> 23 is supported. 24 </p> 25 26 <div class="canvas-container"> 27 <h2>Normal Canvas</h2> 28 <canvas id="onscreen-canvas" width=500 height=500></canvas> 29 <button id="busy-button">Make main thread busy</button> 30 </div> 31 <div class="canvas-container"> 32 <h2>Web Worker Canvas</h2> 33 <canvas id="offscreen-canvas" width=500 height=500></canvas> 34 </div> 35</body> 36<script type="text/javascript" src="https://unpkg.com/canvaskit-wasm@0.25.0/bin/full/canvaskit.js"></script> 37<script type="text/javascript" src="shared.js"></script> 38<script type="text/javascript" src="main.js"></script> 39