PCとスマホの処理能力

Question

forで200回繰り返し動的DOM生成処理をします
PCだと即時反映されますがスマホだとforの処理が終わるまでに時間がかかるようです
PCとスマホでは10秒～15秒くらいの差がでます
回線はどちらも同じです
PC→Firefox スマホ→クロームです
この差はスマホのCPUの性能の悪さから生まれるのでしょうか
スマホのCPUというのは、良いものに変更できるのでしょうか
その他考えられる要因があれば教えて下さい

Answer 1

　手元のデバイスで試してみたところ、200回程度では差が見られませんでした。

　20000回で試したところ、win10（第8世代 Core-i5） Firefox で 42ms、iPhone mini 12 Safari で 15ms でした。

			console.time('test')
			for (let i = 1; i < 20000; i++) {
				const e = document.createElement('div')
				e.append(document.createTextNode(i))
				document.body.append(e)
			}
			console.timeEnd('test')

　いずれにせよ、200回のDOM要素生成で15秒かかるというのは遅すぎるように思うので、別の要素が絡んでいるように思います。

Answer 2

PCもスマートフォンも性能はピンキリですが、おおざっぱにはスマートフォンのほうが数倍遅い感じです。
また、同じマシン上で同じコードを動かしていても Firefox が速かったり Chrome が速かったりという差が出ることがあります。

操作不能になる時間の長さが気になるようなら、少しずつDOMに追加して少しずつ画面に反映させることも可能です。

スマホのCPUというのは、良いものに変更できるのでしょうか

速いCPUを持つものに買い換えるしかないでしょう。