25. 图片裁剪

本教程最新版为 8.x,当前版本已放弃维护,请阅读最新版本!

说明

网页上图片的大小,也是一个需要我们特别关注的点,尤其是在没有使用 CDN 的情况下。

下面分享一个故事:

几十个人的微信群里一朋友分享了自己新开发的网站,打开时发现巨慢无比,以为是自己网络又抽风了,刚好电脑在身边,快速打开 learnku.com 测试下,打开速度还挺快,排除网络线路问题。

使用浏览器打开朋友的网址,下意识地使用 Chrome 开发者工具查看请求,发现第一屏加载了一张图片,竟然有 8M ,并且页面上还有其他四张照片,加起来也要 12M,整个页面光加载这些高清照片就要花费 20M,都能够上一个十分钟的分辨率一般的微电影的体积了。

询问了下网站带宽,得到的回复是:2M(个人网站,很正常),也就是说理论下载速度是 256Kbit/s,一个访问需要 78.125 秒才能下载完。 基本上就是有一个人访问网站,其他人就无法访问,只能等。

以上是作者经历的一个真实的例子,相信你的身边也没少出现这样的事情。

优化的原则

100kb 原则

图片,尤其是访问量较大的页面的图片,都要严格控制图片大小。有个标准就是...

本文章首发在 LearnKu.com 网站上。

为了保证课程的高品质,我们需要对课程进行收费。付费后 才能观看剩余内容。 购买

上一篇 下一篇
《L04 微信小程序从零到发布》
从小程序个人账户申请开始,带你一步步进行开发一个微信小程序,直到提交微信控制台上线发布。
《L02 从零构建论坛系统》
以构建论坛项目 LaraBBS 为线索,展开对 Laravel 框架的全面学习。应用程序架构思路贴近 Laravel 框架的设计哲学。
讨论数量: 0

暂无话题~