css - 移动端适配与不适配方案探讨

Question

方案一：
JS 定宽，改变缩放值
Viewport 方式定宽
Html字体设置为100px;
body给个max-width
判断低版本浏览器
优势：直接根据设计图出稿，简单出暴；
缺点：不能1:1像素还原等等

1：JS 定宽，改变缩放值
    function ScaleW(){
        var w=window.screen.width;
        var targetW=640;
        var scale=w/targetW;
        var meta=document.createElement('meta');
        meta.name='viewport';
        meta.content='initial-scale='+scale+',maximum-scale='+scale+', user-scalable=no';
        document.head.appendChild(meta);
    }
    ScaleW();
    window.addEventListener("resize",ScaleW,false);
2：Viewport 方式定宽
meta vieportcontent=" width=640,user-scalable=no" 

方案二：
手淘的Flexible的方案；
优势：1:1像素还原等其它公认的
缺点：个人在chrome模拟器下浏览，会感觉跟设计图有偏差，这个偏差是指设计图是是按照640的宽度设计，因为做了像素还原，所以看起来有点变扭

不知道大家都是用哪种方案的？