首页 > 试题广场 >

讲一下资源加载优化：按需、分包、预获取与关键路阻断排查。

[问答题]
讲一下资源加载优化：按需、分包、预获取与关键路阻断排查。
添加回答
Crish07头像 Crish07
资源加载优化 = 按需加载 + 合理分包 + 智能预获取 + 清除关键路径阻塞 具体措施： - 按需加载：路由按需加载、组件按需引入、图片/视频使用懒加载 - 合理分包：使用 webpack / vite 内置的分包能力按路由分包、公共依赖提取为单独的包 - 智能预获取：关键资源使用 preload，未来可能用到的资源使用 prefetch - 阻塞资源的 JS 添加 defer 属性；首屏内联关键 CSS，异步加载其余样式
发表于 2026-03-25 17:42:08 回复(0)
已转码的钝角很开心头像 已转码的钝角很开心
资源加载优化的核心：加速首次有效渲染 通过排查并缩短关键渲染路径（CRP）来解决最紧迫的阻塞问题，利用代码分包（路由分包，组件分包）和按需加载（路由懒加载，图片懒加载）来减小初始载荷，再通过预获取技术（preload，prefetch）智能加载未来资源，最终实现极致的加载性能和用户体验
发表于 2026-02-24 13:40:57 回复(0)
WangYibo头像 WangYibo
按需：路由懒加载，图片懒加载 分包：路由分包，组件分包 预获取：preload / prefetch
发表于 2026-01-14 17:28:38 回复(0)
牛客41767380号头像 牛客41767380号
按需：路由懒加载，图片懒加载 分包：路由分包，组件分包 预获取：preload/prefetch
发表于 2026-01-10 15:15:15 回复(0)
秋水夏树头像 秋水夏树
按需：路由懒加载，图片懒加载 分包：路由分包，手动分包（node_modules 子包常年不变，业务代码子包更新文件指纹变化只需重载主包资源） 预获取：pre-load / pre-fetch
发表于 2025-09-16 01:52:40 回复(0)
提交观点

问题信息

来自：前端开发-牛客面经八股
难度：
5条回答 516浏览

热门推荐

相关试题

扫一扫，把题目装进口袋

求职之前，先上牛客

扫描二维码，进入QQ群

扫描二维码，关注牛客公众号