http://isux.tencent.com/introduction-of-webp.html http://jingyan.baidu.com/article/2d5afd699cd7de85a3e28e6e.html…

把已有的图片转换为WebP格式 要使用WebP格式,需要将你网站用到的图片都制作一份WebP格式的版本,如果你使用CDN服务商,它们一般都会提供转码到WebP格式的选项.如又拍云: 增加这样的配置后,我们可以通过给图片URL加上相应的后缀,来使用WebP格式的版本资源. 你也可以使用webpack.gulp的插件来批量转换图片格式.这里不赘述. 在浏览器中使用WebP格式 因为不是所有浏览器都支持WebP格式,我们就有两种思路:一个是只在支持WebP格式的浏览器中使用WebP格式:一个是让不支持…

强化学习入门最经典的数据估计就是那个大名鼎鼎的  reinforcement learning: An Introduction 了,  最近在看这本书,第一章中给出了一个例子用来说明什么是强化学习,那就是tic-and-toc游戏, 感觉这个名很不Chinese,感觉要是用中文来说应该叫三子棋啥的才形象. 这个例子就是下面,在一个3*3的格子里面双方轮流各执一色棋进行对弈,哪一方先把自方的棋子连成一条线则算赢,包括横竖一线,两个对角线斜连一条线. 上图,则是  X 方赢,即: reinforc…

- 通常机器学习,目的是,找到一个函数,针对任何输入:语音,图片,文字,都能够自动输出正确的结果. - 而我们可以弄一个函数集合,这个集合针对同一个猫的图片的输入,可能有多种输出,比如猫,狗,猴子等,而我们通过提供大量的training data给这个函数集合,对集合里的各种函数组合的输出进行比对,最后选出一个能输出最佳结果(结果是猫)的组合,那么因为这个组合已经很能够很准确的识别猫,所以这个组合就能用来检测图片里是否是猫. - 具体来说,下面第一张图,某一个点为一个函数,而整个网络机构为函数集…

附上斯坦福cs224n-2019链接:https://web.stanford.edu/class/archive/cs/cs224n/cs224n.1194/ 文章目录 1.课程简单介绍 1.1 本课程目标 1.2 今年的课程与以往的不同 1.3 作业计划 2.人类语言和词义 2.1 我们应该如何表示一个单词的词义(word meaning) 2.2 我们如何在计算机中得到一个可用的词义(word meaning) 2.2.1 常见的解决方案:例如,使用WordNet 2.2.1.1 Word…

深度学习与人类语言处理(Deep learning for Human Language Processing) 李宏毅老师深度学习与人类语言处理课程笔记,请看正文 这门课会学到什么? 为什么叫人类语言处理呢? 现在大家熟知的基本都是自然语言处理,那什么是自然语言呢? 在自然中发展出来的用于沟通的语言(例如中文.英文) 自然语言相反的是人造语言:例如编程(Java.python) 人类的自然语言分为两种形态:语音.文字 所以这门课叫深度学习与人类语言处理 大多数自然语言处理课程中语音处理只占了一…

学习性网站: https://developers.google.com/speed/webp/docs/cwebp http://www.w3ctech.com//topic/1672 https://isux.tencent.com/introduction-of-webp.html webp 批量处理工具: http://isparta.github.io/index.html ［webp 命令］: 图片 转 webp :cwebp -q 90  psb.jpeg -o output.we…

    webp是谷歌10年发布的一种新的图片格式,支持有损压缩或无损压缩.据官方称无损压缩的webp在体积上要比png小26%,而有损压缩要比同质量jpg小25%~34%.经本人测试,由腾讯智图处理的不同图片转换webp压缩率不太一样,在24%~83%之间都有.这样大的压缩率对于我们Web前端开发工程师诱惑力实在太大了.因为互联网很大一部分流量都来自图片,图片体积变小可以帮助我们让网页加载地更快,这对提升用户体验是有帮助的.     webp有损压缩使用了一种高级预测编码方法对图片进行编码,这…

当今互联网,无论网页还是APP,流量占用最大的,多数都是因为图片,越是良好的用户体验,对图片的依赖度越高.但是图片是一把双刃剑,带来了用户体验,吸引了用户注意,却影响了性能,因为网络请求时间会相对比较长. 图片分很多种,比较主流的就是:位图(BMP),jpg(JPEG,有损压缩格式),png(无损压缩格式)等,这三种,按照图片大小和清晰度来看,依次是:BMP > png > jpg.因为jpg是有损压缩格式,所以jpg图片相对最小.iOS普遍选择的是png来作为最优先选择的图片(苹果官方也是这…

WebP  是一种支持有损压缩和无损压缩的图片文件格式,派生自图像编码格式 VP8.根据 Google 的测试,无损压缩后的 WebP 比 PNG 文件少了 45% 的文件大小,即使这些 PNG 文件经过其他压缩工具压缩之后,WebP 还是可以减少 28% 的文件大小.   PNG 转 WebP 的压缩率要高于 PNG 原图压缩率,同样支持有损与无损压缩 转换后的 WebP 体积大幅减少,图片质量也得到保障(同时肉眼几乎无法看出差异) 转换后的 WebP 支持 Alpha 透明和 24-bit…

此文已由作者吴维伟授权网易云社区发布. 欢迎访问网易云社区,了解更多网易技术产品运营经验. 前端性能优化是一件很琐碎的事情.它不像其它很多技术,在确切有限的步骤下就可以把功能做好.它就像是在打扫屋子,需要时常去检查屋子是否有不整洁的地方,然后立即整理.所以在性能优化的过程中会遇到各方面的问题.本文的主题是聊聊怎么让图片更"整洁". 什么是WebP WebP是一种新的文件格式,相比于jpg.png.gif,在相同的图片质量的情况下,它有着更小的图片大小,可以大大缩小页面加载时间.可以参考…

刚参加前端工作,字体一般使用px来设置大小,在处理响应式界面时对字体的大小变化处理感觉很吃力,得知对字体的大小有三种大小格式设置方式,便想一探究竟,希望可以有所帮助! px px像素(Pixel),相对长度单位,像素px是相对于显示器屏幕分辨率而言的.(引自CSS2.0手册) 譬如,Windows的用户所使用的分辨率一般是96像素/英寸. 而MAC的用户所使用的分辨率一般是72像素/英寸. 特点: 1. IE无法调整那些使用px作为单位的字体大小: 2. 国外的大部分网站能够调整的原因在于其使用…

js详细资料: http://javascript.ruanyifeng.com/ 『引』最全前端资源汇集: 来源:http://www.jeffjade.com/2016/03/30/104-front-end-tutorial/ Unveil.js基于jQuery轻量级的图片懒加载插件: 资料来源:http://www.uedsc.com/unveil-js.html 响应式图像: 资料来源:https://isux.tencent.com/responsive-image.html…

总结: 1: CSS动画:@keyframes  animation:ie10+:加-webkit前缀: animation 则是属于关键帧动画的范畴; 它本身被用来替代一些纯粹表现的javascript代码而实现动画. 基于animation和@keyframe 的动画一方面也是为了实现表现与行为的分离; 另一方面也使得前端设计师可以专注得进行动画开发而不是冗余的代码中.   2: CSS过渡:transition:ie10+;加-webkit前缀: transition 是令一个或多个可以用…

* 官方:           W3C:http://www.w3.org/           ECMA:http://www.ecmascript.org/           Mozilla:https://developer.mozilla.org/zh-CN/           微软提供的H5实验室:http://html5labs.interoperabilitybridges.com/ * 第三方国内:           前端网:http://www.w3cfuns.com/p…

WebP(发音 weppy),是一种支持有损压缩和无损压缩的图片文件格式,派生自图像编码格式 VP8.根据 Google 的测试,无损压缩后的 WebP 比 PNG 文件少了 45% 的文件大小,即使这些 PNG 文件经过其他压缩工具压缩之后,WebP 还是可以减少 28% 的文件大小. 2010 年发布的 WebP 已经不算是新鲜事物了,在 Google 的明星产品如 Youtube.Gmail.Google Play 中都可以看到 WebP 的身影,而 Chrome 网上商店甚至已完全使用了…

PC端,触屏版: 前端JS方案——利用img标签加载一张base64的WebP图片,在img标签的onload事件中判断该图片是否具有宽高的属性,若有表示支持webP,若没有表示不支持webP.后台判断方案——判断浏览器请求头Accept是否支持WebP,返回是否支持的标示给前台. 以上两种方案中,前端方案为佳,当JS被禁止的时候,可以使用后台判断方式执行判断.附上JS代码截图 iOS独立版: 用户直接拉取WebP格式的图片(如果CDN有存储),下载完成后在前端实时转码(前端开发的WebP sd…

看了一下腾讯ISUX网页,无论是pc端还是移动端,展示都挺好看的,先对其代码进行分析如下: 1,先看前三行代码 <!DOCTYPE html> <!-- 腾讯 ISUX 是腾讯集团核心.全球最具规模的UX设计团队.我们正在招 UI开发.前端开发.客户端开发.快把简历发到 isux@qq.com 吧! --> <html lang="en-US" prefix="og: http://ogp.me/ns#"> 第一行,很正常,目前的…

前言 不管是 PC 还是移动端,图片一直是流量大头,以苹果公司 Retina 产品为代表的高 PPI 屏对图片的质量提出了更高的要求,如何保证在图片的精细度不降低的前提下缩小图片体积,成为了一个有价值且值得探索的事情. 但如今对于 JPEG.PNG 和 GIF 这些图片格式的优化几乎已经达到了极致, 若想改变现状开辟新局面,便要有釜底抽薪的胆量和气魄,而 Google 给了我们一个新选择:WebP. 对 WebP 的研究缘起于手机 QQ 原创表情商城,由于表情包体积较大,在 2G/3G 的网络环…

前言 不管是 PC 还是移动端,图片一直是流量大头,以苹果公司 Retina 产品为代表的高 PPI 屏对图片的质量提出了更高的要求,如何保证在图片的精细度不降低的前提下缩小图片体积,成为了一个有价值且值得探索的事情. 但如今对于 JPEG.PNG 和 GIF 这些图片格式的优化几乎已经达到了极致, 若想改变现状开辟新局面,便要有釜底抽薪的胆量和气魄,而 Google 给了我们一个新选择:WebP. 对 WebP 的研究缘起于手机 QQ 原创表情商城,由于表情包体积较大,在 2G/3G 的网络环…

随着AlphaGo和AlphaZero的出现,强化学习相关算法在这几年引起了学术界和工业界的重视.最近也翻了很多强化学习的资料,有时间了还是得自己动脑筋整理一下. 强化学习定义 先借用维基百科上对强化学习的标准定义: 强化学习(Reinforcement Learning,简称RL)是机器学习中的一个领域,强调如何基于环境而行动,以取得最大化的预期利益. 从本质上看,强化学习是一个通用的问题解决框架,其核心思想是 Trial & Error. 强化学习可以用一个闭环示意图来表示: 强化学习四元素…

一句话就有css3动画: 2016-6-29 <style type="text/css"> h1{background:#999;} h1:hover{border-left:10px solid #000;padding-left:15px;background:#33ccff;transition:all .5s;} </style> <h1>一句话就有css3动画</h1> http://www.cnblogs.com/qq212…

腾讯isux网站的一个小问题. 它的网站:http://isux.tencent.com/?variant=zh-hans     优秀的网站和差的网站的距离往往就在于细节.   浏览环境:谷歌.     它的小问题,就是简繁体切换时,会有蓝色的边框.边框和汉字是明显有重叠问题的. 可以看我的动态截图.   问题就是a链接.:focus没有重置.     问题2: 一点点的用户体验. 本来是想看网站的最下方的链接的.但是每次滚动鼠标到最下面时,就加载了新的内容.用的瀑布式. 也就是说用户很难点到…

AI工程师职业规划和学习路线完整版   如何成为一名机器学习算法工程师 成为一名合格的开发工程师不是一件简单的事情,需要掌握从开发到调试到优化等一系列能 力,这些能力中的每一项掌握起来都需要足够的努力和经验.而要成为一名合格的机器学习算法工程师(以下简称算法工程师)更是难上加难,因为在掌握工程师的通用技能以外,还需要掌握一张不算小的机器学习算法知识网络.下面我们就将成为一名合格的算法工程师所需的技能进行拆分,一起来看一下究竟需要掌握哪些技能才能算是一名合格的算法工程师. 基础开发能力 所谓算法工…

NoSQL基础学习 最近学习的第一个Nosql就是Mongodb,为了了解Nosql的基本知识,特地总结,主要是学习Nosql的理论 一.Introduction(介绍) 它是“ Not Only Sql”的简称,非关系型数据库,它具有非常好的通用性和非常高的性能,它在处理大量的数据方面很有优势. 1.NoSql的出现是相对于传统的关系型数据库的,重点就是,Wiki上所说的: NoSQL是對不同於傳統的關聯式資料庫的数据库管理系统的統稱. 兩者存在許多顯著的不同點,其中最重要的是NoSQL不使用…

语音识别 语音识别该何去何从? 1969年,J.R. PIERCE:"语音识别就像把水变成汽油.从大海中淘金.治疗癌症.人类登陆月球" 当然,这是50年前的想法,那么语音识别该如何做呢? 一个典型的语音识别系统如下,输入一段语音到模型,模型输出一段文本 Speech:表示一个长度为T,维度为d的向量序列 Text:一个token序列,长度为N,V个不同的token,通常T>N 接下来看看输入可以有哪些可能,输出有哪些可能,首先看下输出部分 输出Token 音位(phoneme,发…

当前网络中,图片仍是占用流量较大的一部分,在网站的视觉效果和加载速度之间,我们始终面临着两难选择. 一个网站的内容,不仅仅只有文字,图片.动图.视频等众多元素都在帮助用户从我们的网站获取更多的信息,当然,图片比起文字会消耗更多的网络资源,并且最令人担忧的是,它会增加网站的加载完成时间,影响用户体验. 为了在尽可能不影响图片质量的前提下压缩体积,谷歌公司在 2010 年提出了 WebP 格式. 有一些现实的问题摆在我们面前. 在互联网碎片化的大趋势下,相对于文字来说,大部分人会更愿意接受图片所传递…

最近,我们在项目中实践了webp图片,并且抽离出了工具模块,整合到了项目的基础模板中.传闻IOS10也将要支持webp,那么使用webp带来的性能提升将更加明显.估计在不久的将来,webp会成为标配. 本文主要分享一下我们在webp图片使用上的实践之路. 我们会从三部分来聊聊webp这个话题. 什么是webp,它有什么用? 使用webp的常规方法以及优劣. 我们是如何用上webp的. PS:如果是对webp有一定了解的朋友,建议直接看第三部分.因为是讲我们的实践之路,所以第三部分会多讲一些. 一…

其实今年很早就有接触到webp图片的概念,只是一直没怎么弄.今天在一个小项目中小用了一番.总结总结 采用 what,why,how的方式来总结 what? 什么是webp图片? 维基百科:          1.WebP(发音weppy),是一种同时提供了有损压缩与无损压缩(可逆压缩)的图片文件格式. 2.WebP最初在2010年发布,目标是减少文件大小,但达到和JPEG格式相同的图片质量,希望能够减少图片档在网络上的发送时间. 3.根据Google较早的测试,WebP的无损压缩比网络上找到的P…

本文为腾讯Bugly开发者社区 投稿,作者:soonlai,版权归原作者所有,未经作者同意,请勿转载,原文地址:http://dev.qq.com/topic/582939577ef9c5b708556b0d 1.背景 目前网络中图片仍然是占用流量较大的一部分,对于移动端更是如此,因此,如何在保证图片视觉不失真前提下缩小体积,对于节省带宽和电池电量十分重要. 然而目前对于JPEG.PNG.GIF等常用图片格式的优化已几乎达到极致,因此Google于2010年提出了一种新的图片压缩格式 – Web…