test bezier

test.js

var c = document.createElement('canvas');
c.width = innerWidth;
c.height = innerHeight;

var ctx = c.getContext('2d');

document.body.appendChild(c);

var last = performance.now();
var delay = 0;

var texts = [];
for (i=0;i<3000; i++) {
	texts[i] = Array(10).join(String.fromCharCode(40 + Math.random() * 90 | 0));
}

function animate() {
	requestAnimationFrame(animate);

	var now = performance.now();

	delay = (now - last) * 0.05 + delay * 0.95;
	last = now;

	ctx.clearRect(0, 0, c.width, c.height);
	ctx.fillText(~~delay +'ms / ' +  (1000/ delay | 0) + 'fps', 50, 50);

	for (i=0; i < 400; i++) {
		// ctx.fillText(texts[i], 50 + Math.random() * innerWidth * 0.8, 50 + Math.random() * innerHeight * 0.8);	
		// ctx.fillText(texts[i['hello', 50 + Math.random() * innerWidth * 0.8, 50 + Math.random() * innerHeight * 0.8)

		// ctx.beginPath();
		// ctx.moveTo(50 + Math.random() * innerWidth * 0.8, 50 + Math.random() * innerHeight * 0.8);
		// ctx.lineTo(50 + Math.random() * innerWidth * 0.8, 50 + Math.random() * innerHeight * 0.8);
		// ctx.stroke();

		ctx.lineWidth = 4;
		ctx.beginPath();
		ctx.moveTo(50 + Math.random() * innerWidth * 0.8, 50 + Math.random() * innerHeight * 0.8);
		ctx.quadraticCurveTo(
			50 + Math.random() * innerWidth * 0.8, 50 + Math.random() * innerHeight * 0.8,
			50 + Math.random() * innerWidth * 0.8, 50 + Math.random() * innerHeight * 0.8);
		ctx.stroke();

	}

	// 5000 - 25ms / 38fps
	// 10000 - 50 / 20
	// 2000 - 16 / 60

	// 25fps for quad



}

animate();