webp格式的图片既然有那么多的好处，那么如何使用这种格式的图片？首先要考虑到兼容性，对于不支持webp格式的图片依然使用原来的方式， 对于支持webp格式的图片则使用新的格式。例如静态资源中包含了webp和img两个文件夹，分别是webp资源和png资源。对于同一个使用背景图的元素， 我们原先是这样设置的

        .elem {
            background-image: url(../img/bg1.png);
            ......
但是我们想在要支持webp格式的，则现在有这样一种方法。先看一下结果:
 
        [data-webp="0"] .elem {
            background-image: url(../img/bg1.png);
            ......
        [data-webp="1"] .elem {
            background-image: url(../webp/bg1.webp);
            ......
这种通过data-webp属性选择器来判断使用哪种的方式来设置图片，首先判断当前环境是否支持webp方式， 然后将是否支持(1/0)给一个根元素(html)设置为data-webp的属性值，那么怎么判断浏览器环境是否支持webp哪？
 代码是：
 
        function isSupportWebp () {
            // save the results supported by the browser
            var flag = '0'
            // get canvas element
            var canvasEL = document.createElement('canvas')
            // get html element
            var docEl = document.documentElement || document.getElementsByTagName('html')[0]
            // determine whether the browser supports canvas elements
            if (canvasEL.getContext && canvasEL.getContext('2d')) {
                flag = canvasEL.toDataURL('image/webp').indexOf('image/webp') > -1 ? '1' : '0'
            // set data-webp attribute for html
            docEl.setAttribute('data-webp', flag)
            // return supported result
            return flag
        isSupportWebp()
					一个做过前端开发的产品经理，经历过睿智产品的折磨导致脱发之后，励志要翻身"农奴"把歌唱，一边打入敌人内部一边持续提升自己，为我们广大开发同胞谋福祉，坚决抵制睿智产品折磨我们码农兄弟！
					05-21
				
程序猿日常快过年了！
使用方法  https://github.com/wugemu/lz.js.git引入jquery.lazyload.lz.js
例如：<img src="occupying270.png" data-original="4304485231505859.jpg" webp="true">
img标签增加webp 属性 控制是否使用webp模式webp="true" ，该img
				
鉴于之前做的大屏的项目，全屏背景图过大，传统的写法导致页面渲染过慢，因而非常影响用户体验。
除此以外，很多时候在开发过程中会出现很多图片的情况，图片过多或大，会直接影响页面的响应时间，从而导致页面性能变差。
针对以上，我们可以使用WebP来有效的改善。
关于WebP
WebP格式，谷歌（google）开发的一种旨在加快图片加载速度的图片格式。图片压缩体积大约只有JPEG的2/3，并能节省大量的服...
				
最近，我们在项目中实践了webp图片，并且抽离出了工具模块，整合到了项目的基础模板中。传闻IOS10也将要支持webp，那么使用webp带来的性能提升将更加明显。估计在不久的将来，webp会成为标配。
本文主要分享一下我们在webp图片使用上的实践之路。
我们会从三部分来聊聊webp这个话题。
什么是webp，它有什么用?
使用webp的常规方法以及优劣。
我们是如何...
WebP格式
　　WebP是Google推出的一种图片格式，它基于VP8编码，可对图像大幅压缩。与JPEG相同，WebP也是一种有损压缩，但在画质相同的情况下，WebP格式比JPEG图像小40%。 Wiki  百度百科
 　　它是一个开源项目，我们可以在此获取其中源码，以及相关工具。
浏览器支持
                    weixin_45761956: 
                    您好 如果按照您的说话为共享传递(传递实参的地址的话)在函数作用域中如果function someFun (num, obj1, obj2) {
    num *= 20;
    obj1.name = "李四";
    obj2 = 123;
}那么person2应该也是会改变的