简谈Web前端针对图片显示的优化方案

时间:2024-06-05 07:57:17 Web Services 我要投稿
  • 相关推荐

简谈Web前端针对图片显示的优化方案

  "浅谈Web前端针对图片显示的优化方案3"

简谈Web前端针对图片显示的优化方案

  他们选择图片的一种主颜色,并用其作为占位块的背景色。这样做会给用户一种图片加载速度更快的体验。

  更先进的方法:.的200 byte技术

  年初.发表过一篇"The technology behind preview photos"的文章,这篇文章主要说明如何预览一个没有JPEG头的42 * 42px的图片。 使用场景有些不同,这“图片”被用于.的手机端,它知道如何组成一个有效的JPEG图片。此处我们在Web端使用的话需要编写JavaScript代码,这样做同样会增加存储资源。当然我们可以通过在服务器端组成这个图片解决这一问题,但是这样仍需要一些JavaScript代码发送申请图片资源的请求。

  无论如何,这个方法对于Web端来说有点大材小用,但我还是希望能够将其作为一个参考。Using WebP for generating this preview images同样可以节省内存,并且不需要使用如此创造性的解决方法。

  LQIP: Low Quality Image Placeholders

  与其等待最终的图像呈现,我们可以先提供一个高度压缩的图片,然后切换到大图。这就是LQIP方法的思路。这一方法与Medium相似,不过是使用相同尺寸,但压缩更高的图片。

  总结

  随着页面加载的图片越来越多,需要勤于思考页面的加载过程。因为这会影响加载效率和用户体验。 如果你生成几个缩略图大小的图片,你可以实验使用一个非常小的图片作为背景,等待最终图片被加载出来。

【简谈Web前端针对图片显示的优化方案】相关文章:

web前端应聘自我介绍02-25

网站图片优化的技巧08-22

web前端实训总结(通用6篇)02-02

网站图片seo优化的细节08-19

SEO图片优化解析01-11

网易web前端开发师面试问答的经历08-19

web前端学习心得体会范文01-09

电商网站的图片怎么优化08-20

web前端开发工程师工作的岗位职责01-23

web前端工程师实习心得体会09-29