Search code examples
uiwebviewrenderingmobile-safarifont-faceperformance

Speed up mobile safari font-face rendering?


i render customs fonts in a webview on the iPad. rendering works and the fonts get displayed as they should. but, the rendering is slow. so everything is on my pages loads up quickly, except for the font-face. any idea how i can speed up things?

thanks


Solution

  • There are a few options you have to optimise your font-face rules. By using a data: url you can use the font inline by encoding in base64. For example:

    @font-face {
        font-family: "My Font";
        src: url("data:font/opentype;base64,[base-encoded font here]");
    }
    

    There are some other useful performance considerations and approaches outlined in this article from 2009.