Cordova iOS - fails to render SVG icons and fonts randomly

After opening the app, the screen will flicker and then the content will render but the SVG icons are missing and the custom font is not used. If I quit the app and open again, everything displays as expected. I’ve experienced using Blaze and now Svelte so I don’t think either of them is to blame.

Has anyone else run into this situation?

We have / had the same issue.

Our “quick fix” is to basically inline all SVGs and images which are part of the layout, meaning using

src: url(data:font/ttf;base64,AAEAAAARAQAABAAQR0RFRga4BgAAAL9YAAAAOEdQT1MlBfY7AAC


content: url("data:image/svg+xml;base64, PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjE4NTQuOTkgNDA3LjgyI (…)

in our css / scss files.

We converted the files using File to Base64 Converter - Encode Files to Base64 - Online - Browserling Web Developer Tools
and reading up on stuff here:


This gets rid of the issue.

→ But we are / weren’t exactly sure where that comes from.

But actually yesterday I had a hunch: I noticed that all our builds need & do a Hot Code Push basically immediately after they’re started, probably because our settings between the server & the mobile-settings.json we built the app with isn’t identical. Maybe the early reload / refresh of either the internal Cordova WebAppServer or the client having an issue loading the image & then not retrying is connected to this?

→ Maybe when I get around to it I’ll look into how to sync the build settings with the actual server settings, though even that wouldn’t help after a newer version has been released via the server actually.

1 Like