| <!DOCTYPE html> |
| <html> |
| <body> |
| <canvas id='c'></canvas> |
| <script> |
| var fontNameList = ["Palatino Linotype", "Times New Roman", "Arial", "sans-serif"] |
| var fontWeightList = ["", "bold", "bolder", "lighter"]; |
| var fontSizeList = ["10pt", "15pt", "20pt", "small", "large", "15px", "20mm"]; |
| |
| var canvas = document.getElementById("c"); |
| var ctx = canvas.getContext("2d"); |
| |
| function doFrame() { |
| canvas.width = canvas.width; |
| for (var i = 0; i < 20; i++) { |
| fontNameList.forEach(function(fontName) { |
| fontWeightList.forEach(function(fontWeight) { |
| fontSizeList.forEach(function(fontSize) { |
| ctx.font = fontWeight + " " + fontSize + " " + fontName; |
| // Use the font to make sure the font is completely resolved (has no pending lazy inits) |
| ctx.fillText("Test", 0, 50); |
| }); |
| }); |
| }); |
| } |
| requestAnimationFrame(doFrame); |
| } |
| requestAnimationFrame(doFrame); |
| </script> |
| </body> |
| </html> |