iOS 15: Safari crashes with GPU Process: Canvas Rendering

Hi. iOS 15 Safari crashes when GPU Process: Canvas Rendering is turned on. Please follow these steps to replicate the issue:

  1. Turn on "GPU Process: Canvas Rendering";
  2. Open the example file in safari

Example of this canvas: https://drive.google.com/file/d/1ebTi7sjUyGzr-U7o55WPI_3TuvKhb6Ga/view?usp=sharing

<head>
  <script language="javascript">
	function init() {
	const canvas = document.createElement("canvas");
	canvas.style.width = "800px";
	canvas.style.height = "600px";
	canvas.width = 1600;
	canvas.height = 1200;
	document.body.appendChild(canvas);
	let first = null;
	const radius = 2;
	const paint = (step) => {
		first = first ?? step;
		const diff = (step - first) / 50;
		const ctx = canvas.getContext("2d");
		ctx.clearRect(0, 0, 1600, 1200);
		for (let k = 0; k < 3; k++) {
		ctx.fillStyle = ['rgba(76, 175, 80, 0.5)', 'rgba(176, 175, 80, 0.5)', 'rgba(76, 175, 180, 0.5)'][k];
		ctx.beginPath();
		for (let j = 0; j < 5000; j++) {
			const x = 1600 - j * 2 * 0.2;
			const y = 300 * (k + 1) + 100 * Math.sin((j + diff) * Math.PI / 500);
			ctx.moveTo(x + radius, y);
			ctx.arc(x, y, radius, 0, Math.PI * 2, false);
		}
		ctx.fill();
		for (let j = 0; j < 5000; j++) {
			const x = 1600 - j * 2 * 0.2;
			const y = 300 * (k + 1) + 100 * Math.sin((j + diff) * Math.PI / 500);
			const height = Math.random() * 100;
			ctx.fillStyle = 'red';
			ctx.fillRect(x, x + 0.2, 0.2, height);
		}
		}
		requestAnimationFrame(paint);
	};
	requestAnimationFrame(paint);
	}
  </script>
</head>
<body onload="init()">
</body>
</html>
  • same question

  • IOS 15.0.1 still crash

Add a Comment

Replies

Hi, please report this on Feedback Assistant and attach a sample repro project.

  • Hello, here is the Feedback ID FB9661718

  • Can somebody from the Apple team clarify the status of the issue? It affects millions of users every day.

  • @rga it’s being investigated by WebKit as a P1 issue.

FB9669591 issue reported