structuredClone is handy, right?
https://developer.mozilla.org/ja/docs/Web/API/structuredClone
It was so convenient that I adopted it everywhere on the frontend—but the other day I got a report from an iOS user saying the app was unusable.
There was no server issue, so I wondered why. I suggested updating iOS, and after they updated, it worked again. I heard a similar story today, and when I looked properly, structuredClone is only supported on iOS from 15.4 onward. By release date, that is late March 2022.
Should I say more than six months have passed, or that it has not even been a full year yet? iOS auto-updates only happen when the device is plugged in and on Wi‑Fi. So plenty of users go a year or more without updating iOS. In Japan, you can still find users on iOS 15.3 or earlier. Here is how to use structuredClone while still supporting those users.
How to handle it
1. Warn the user
You can check whether structuredClone is supported with typeof, show an alert, and move on.
if (typeof structuredClone !== "function") {
alert(`This OS is not supported. Please update to the latest version.`);
}
2. Use a polyfill
A polyfill supplies an alternative method on browsers that do not support the native API. ungap/structured-clone is available.
https://github.com/ungap/structured-clone
It is not the real implementation, but in very simple terms it does something like this.
if (typeof structuredClone !== "function") {
window.structuredClone = (object) => {
return ...// Serialize with JSON here, then deserialize
}
}
Summary
It has been supported on iOS since a release more than six months ago, so personally I would rather nudge users to update—but if you really need to support older versions, use a polyfill.