当前位置: 首页 > 面试题库 >

网站首页有大量的图片,加载很慢,要是你,你该怎么去优化呢?

乐正迪
2023-03-14
本文向大家介绍网站首页有大量的图片,加载很慢,要是你,你该怎么去优化呢?相关面试题,主要包含被问及网站首页有大量的图片,加载很慢,要是你,你该怎么去优化呢?时的应答技巧和注意事项,需要的朋友参考一下

问题不同解决的方法也不同
1,启动页面时加载过多的图片
使用瀑布流==》懒加载
使用雪碧图==〉多个小图放在一个大图上
使用骨架图
首屏优先加载

2,部分图片体积过大
一张100px100px的图片,其中高喊10000个像素点,而每个像素点事通过rgba进行寻处,rgba每个色道都有0~255个取值,也就是2的八次方=256。正好是8位的1byte。而每个像素点事4个色道,每个像素点需要4bytes。因袭该图片体积为100004bytes=40000bytes=39kb。
有了上述的背景知识,我们就知道怎样去优化一张图片了,无非就有两个方向:
一方面是减少像素点 裁剪
另一方面减少每个像素点的字节数 压缩 ==》缩略图

 类似资料:
  • 本文向大家介绍你是怎么优化你的 ts 代码的?相关面试题,主要包含被问及你是怎么优化你的 ts 代码的?时的应答技巧和注意事项,需要的朋友参考一下 你是怎么优化你的 ts 代码的? 作者:rottenpen

  • 本文向大家介绍IOS开发中加载大量网络图片优化方法,包括了IOS开发中加载大量网络图片优化方法的使用技巧和注意事项,需要的朋友参考一下 IOS开发中加载大量网络图片如何优化 1、概述 在IOS下通过URL读一张网络图片并不像其他编程语言那样可以直接把图片路径放到图片路径的位置就ok,而是需要我们通过一段类似流的方式去加载网络图片,接着才能把图片放入图片路径显示。比如: 加载网络图片可以说是网络应用

  • 本文向大家介绍使用vue渲染大量数据时应该怎么优化?说下你的思路!相关面试题,主要包含被问及使用vue渲染大量数据时应该怎么优化?说下你的思路!时的应答技巧和注意事项,需要的朋友参考一下 虚拟列表:vue-virtual-scroll-list,vue-virtual-scroller…… 冻结属性,让不必要的属性不响应:, 或者使用 将对象属性的设置为,源码:vue/src/core/obser

  • 本文向大家介绍如果让你来制作一个访问量很高的大型网站,你会如何来管理所有css、js文件、图片?相关面试题,主要包含被问及如果让你来制作一个访问量很高的大型网站,你会如何来管理所有css、js文件、图片?时的应答技巧和注意事项,需要的朋友参考一下 (1) 遵循自定的一套CSS,JS和图片文件和文件夹命名规范 (2) 依托采用的前端工程化工具,依照工具脚手架规范(gulp, webpack, gru

  • 本文向大家介绍对于加班你是怎么看的?相关面试题,主要包含被问及对于加班你是怎么看的?时的应答技巧和注意事项,需要的朋友参考一下 首先,始终要以工作效率为首要目标,不能出现为了加班而故意降低白天的工作效率。 其次,在保证了白天的工作效率以后,如果确实需要加班,则可以适度的加班,但不能超过10点,不然肯定影响第二天的效率。

  • 本文向大家介绍vue如何优化首页的加载速度?相关面试题,主要包含被问及vue如何优化首页的加载速度?时的应答技巧和注意事项,需要的朋友参考一下 补充下2楼: ssr直出, webpack压缩HTML/CSS/JS, 首屏css单独提取内联, 关键资源Proload, 图片:不缩放,使用webp、小图片base64,iconfont, gzip, dns-prefetch, 静态资源单独域名,去掉c