search

circlingchina / circling

3 stars 0 forks source link

P0: optimize load time by adding image resizing #17

Closed esquaredly closed 4 years ago

esquaredly commented 4 years ago

Looking into "site is too slow" feedback, I looked into the profile from Chrome lighthouse. Ignoring "maybe netlify server is too far from China", there are 2 main issues:

Screen Shot 2020-04-21 at 12 15 46 PM

currently the blogposts uploaded are not resizing images. There's a couple of ways to handle this. Netlify offers some modules in this regard: https://www.netlifycms.org/docs/netlify-large-media/

ylt6 commented 4 years ago

我有个临时方案： 配合使用 parcel-plugin-imagemin 和 eleventy-plugin-lazyimages 先看看有没有效果？

不过对于新增的post无效，可能需要每天定期发布一下。

PR https://github.com/esquaredly/circling/pull/20

结果：

Screenshot 2020-04-21 at 23 48 34

这个方案已经废弃。

ylt6 commented 4 years ago

@esquaredly

https://app.netlify.com/sites/circlingchina/settings/deploys#deploy-notifications 里面有个自动预处理asset的选项可以试用下。

esquaredly commented 4 years ago

@yiliangt5 嗯嗯我看到你打开了 Compress Images，有效果吗？

我看到另外一个（需要一些调试）的方案是这个：https://docs.netlify.com/large-media/transform-images/。我明天可以试一下

ylt6 commented 4 years ago

@yiliangt5 嗯嗯我看到你打开了 Compress Images，有效果吗？

我看到另外一个（需要一些调试）的方案是这个：https://docs.netlify.com/large-media/transform-images/。我明天可以试一下

从文件大小来看没有任何效果。 网站速度提升了因为 Jess 在昨天把包含 2.2m 大图的 event 下了。