轩枫阁

概念

JPEG有两种存储格式：baseline 和 progressive。Baseline JPEG 会在数据可用时，一行一行自上而下显示。Progressive JPEG会先显示模糊图片，然后逐渐清晰。

浏览器渲染

Progressive JPEG在所有浏览器都会显示，这里的关注点是如何渲染。 查看全文

WebP格式

WebP是Google推出的意图改变web图片JPG、PNG、GIF三分天下局势的一种图片格式，可对图像大幅压缩。它不仅支持无损或有损压缩、alpha通道，还支持动画演示。在同画质的情况下，WebP格式图片占用体积相较于jpg图片大约减少40%，相较于无损png图片大约减少30%。

• Wiki
• 百度百科

浏览器支持

Google浏览器Chrome首先引入WebP，此外Opera 11.10也增加对WebP的支持。

如果你能看见下面的图片，说明你的浏览器支持WebP。 查看全文

前言

不管是 PC 还是移动端，图片一直是流量大头，以苹果公司 Retina 产品为代表的高 PPI 屏对图片的质量提出了更高的要求，如何保证在图片的精细度不降低的前提下缩小图片体积，成为了一个有价值且值得探索的事情。

但如今对于 JPEG、PNG 和 GIF 这些图片格式的优化几乎已经达到了极致， 若想改变现状开辟新局面，便要有釜底抽薪的胆量和气魄，而 Google 给了我们一个新选择：WebP。

对 WebP 的研究缘起于手机 QQ 原创表情商城，由于表情包体积较大，在 2G/3G 的网络环境下加载较慢。同事小贝恰好因为 2013 Google I/O Event 了解到了 WebP，于是我们便一起开始了没羞没躁的技术预研，期待在原创表情图片的质量与体积之间寻找最美的平衡。 查看全文

前言

前端时间做过一些带有不少逻辑的H5，例如微信运动，如果用H5开发，大概包含排行榜、profile页、点赞页等页面。不简单页不复杂，主要包含3个页面的切换，可以前进后退，是一个单页应用。但是又比较简单，只需要使用一个前端路由就可以解决。

Q.js代码不到百行，使用起来很简单。

Q.js

Q.js 是一个炒鸡轻量的前端单页路由框架。

http://mouto.org/#!54092

轻量、快速、极简

为了更好的利用缓存以及更少的后端支援，Q.js放弃了 HTML5 State，通过#!格式的 url hach 重现了 url 路由功能。

1. 无 JavaScript 库依托，可随意搭配使用
2. 源代码不及百行压缩后 834byte
3. 支持 IE6+ Chrome Safari FF
4. 未做情况判定，使用 Q.js 必然会注册 window.Q

查看全文

前言

本文主要介绍前端相关的图片优化工具及方法

1. PP鸭 压缩软件

简介：

PP鸭 图片压缩神器，帮你的图片减减肥。

PP鸭整合了业内最优秀的数种开源的图片压缩算法，会自动根据图片特征自动选择压缩参数。只需要将图片拖入PP鸭，就能自动批量压缩，省时省心。

官网：http://ppduck.com/

特点：极致的图片压缩效果，经过长时间反复调校和对比各种算法，PP鸭在品质，体积，速度三者间，帮你定位完美的平衡点

优点：

• 跨平台图片压缩软件（win&Mac），图片压缩能够在保证质量的情况下使图片容量更小。需要付费激活，但能免费试用10次（可循环）。
• 适合独立的小项目，在发布之前进行手动优化，省时简单

查看全文