safari-rendering
Safari & Mobile Rendering Issues
The core insight (read first)
The editor preview and the live page do not render in the same browser.
- It's very common for the editor preview and page editing to happen in Chrome/Chromium (Blink), unless the user is using Safari or Firefox (uncommon).
- The live/published page on a phone or tablet renders in whatever browser engine the user uses to access it, and on iOS/iPadOS every browser is WebKit (Chrome for iOS, Firefox for iOS, in-app browsers like Instagram/TikTok all use WebKit under the hood). There is no non-WebKit browser on an iPhone.
So when a user says "it looks fine in the editor but broken on my phone", "only on mobile/iPhone/iPad", "only on the live page", or "works in Chrome, broken in Safari", the default hypothesis is a WebKit-specific rendering difference — not a Replo bug and not something you can reproduce by looking at the editor preview. If you don't see an obvious data/logic bug, you're most likely looking at Blink, they are looking at WebKit. Don't tell the user "it looks fine to me" from the editor.
When to use
- A visual difference that appears only on a real device, only on the published URL, or only in Safari — not in the editor preview.
- Any symptom in the reference index below.
Not for: a difference you can already reproduce identically in Chrome (that's a normal layout/logic bug — fix it directly), or genuine responsive-design work (a layout simply too wide for a phone is a breakpoint problem, not a WebKit bug).