前端如何获取到手机客户端当前的网络状况信息？

最近想要对移动端的H5项目进行性能优化，其中一部分工作是优化图片的加载速度，现在我想要根据用户客户端的移动状况给界面加载不同压缩率的图片，但是有没有使用js检测用户客户端网络状况的方法呢？

---

微信自带的浏览器的user-agent里面有network字段。你可以挂上代理之后用微信访问任意网页抓包看看

---

自己写一个ajax请求去访问一个接口获得返回时间来判断呗，网络状况貌似只能判断是否连了网。

---

jquery有个类似ping功能的插件，可以获取响应时间，试试看。

以下代码为转载：

$.ping = function(option) 
{
    var ping, requestTime, responseTime ;
    var getUrl = function(url){    //保证url带http://
        var strReg="^((https|http)?://){1}"
        var re=new RegExp(strReg); 
        return re.test(url)?url:"http://"+url;
    }
    $.ajax({
        url: getUrl(option.url)+'/'+ (new Date()).getTime() + '.html',  //设置一个空的ajax请求
        type: 'GET',
        dataType: 'html',
        timeout: 10000,
        beforeSend : function() 
        {
            if(option.beforePing) option.beforePing();
            requestTime = new Date().getTime();
        },
        complete : function() 
        {
            responseTime = new Date().getTime();
            ping = Math.abs(requestTime - responseTime);
            if(option.afterPing) option.afterPing(ping);
        }
    });

if(option.interval && option.interval > 0)
{
    var interval = option.interval * 1000;
    setTimeout(function(){$.ping(option)}, interval);

// option.interval = 0; // 阻止多重循环
// setInterval(function(){$.ping(option)}, interval);

}

};

相关实例：

<div id="msg"></div>
<script language="javascript" src="jquery.js"></script>
<script language="javascript" src="ping.js"></script>
<script>
$.ping({
url : 'http://www.example.com', 
beforePing : function(){$('#msg').html('')},
afterPing : function(ping){$('#msg').html(ping)}, 
interval : 1
});
</script>