使用rem加载页面初始缩放问题

我们常常在移动使用rem进行适配 但是经常发现使用rem后 页面初次加载会有瞬间的缩放问题
应该是因为 dom先加载 然后加载rem计算方法
如何解决 有两个笨方法
1.在css加载后 将body隐藏 然后在所有js加载完成后再显示body(但是有数据加载问题,只适用于静态页)
2.在css中先加上几个常用的font-szie,代码如下(rem 1rem=100px)

<style>
    @media screen and (min-width:640px){
        html{font-size:86px;}
     }
     @media screen and (min-width:414px) and (max-width:639px){
         html{font-size:55px;}
      }
    @media screen and (min-width:375px) and (max-width:413px){
          html{font-size:50px;}
      }
    @media screen and (min-width:320px) and (max-width:374px){
        html{font-size:42.5px;}
      }
</style>