前端面试--moka

nextTick:

异步渲染,DOM异步渲染完毕后执行。

批量渲染。

vite为什么比webpack快?

webpack把所有文件build一次,从入口文件进去,将所有文件编译为一个或多个单独的js文件,无论模块是否执行,都要编译和打包到这个bundler里面。

vite不需要打包,不需要编译,对模块内容进行编译,浏览器支持ESmodule,对相应module发送请求。按需动态编译。

当其中一个模块改变后,vite只需要浏览器重新请求该模块。

webpack需要编译整个模块。

http缓存策略:

设置过期时间:

expires 设置过期时间,决定是否过期。

cache-control:

过期时长 max-age

no-cache 不允许缓存

no-store 不允许缓存

强缓存:没有过期就是用缓存

协商缓存:服务器向浏览器发送一个last-modified: 最后修改时间, 浏览器通过 If-Modified-Since字段中的值和服务器中的last-modified进行对比,若相等就用缓存,不相等则服务器返回新资源和最后修改时间。

服务器缓存:(协商缓存)

200 服务器资源和本地缓存资源版本不是一致,将最新资源和新的资源标识返回给浏览器

304 服务器资源和本地缓存资源版本是一致,所以在本地缓存中拿资源

注意:

ETag: 文件内容唯一标识,客户端收到的上次服务器通知的缓存数据的唯一标识。

服务器向浏览器发送一个ETag唯一标识,浏览器通过If-None-Match 字段通知服务器,将内容进行对比,若相同则直接利用缓存,再者服务器重新发送资源。

http2:

多路复用:允许多个请求和响应在单个TCP连接上并行传输。 --提高性能

头部压缩: 压缩请求和响应的头部,减少数据传输的IO开销。

流控制:客户端和服务端可以限制传输的速率,解决对头阻塞问题

二进制协议

scoped:

样式隔离,让每个style私有化。

给组件中所有元素添加一个唯一标识,data-v-xxx

给标签添加自定义属性,通过属性选择器添加样式

相关推荐
Hooray22 分钟前
为了在 Vue 项目里用上想要的 React 组件,我写了这个 skill
前端·ai编程
咸鱼翻身了么24 分钟前
模仿ai数据流 开箱即用
前端
风花雪月_24 分钟前
🔥IntersectionObserver:前端性能优化的“隐形监工”
前端
Bigger24 分钟前
告别 AI 塑料感:我是如何用 frontend-design skill 重塑项目官网的
前端·ai编程·trae
发际线向北24 分钟前
0x02 Android DI 框架解析之Hilt
前端
zhensherlock38 分钟前
Protocol Launcher 系列:Overcast 一键订阅播客
前端·javascript·typescript·node.js·自动化·github·js
liangdabiao1 小时前
开源AI拼豆大升级 - 一键部署cloudflare page - 全免费 web和小程序
前端·人工智能·小程序
SuperHeroWu71 小时前
【鸿蒙基础入门】概念理解和学习方法论说明
前端·学习·华为·开源·harmonyos·鸿蒙·移动端
Full Stack Developme2 小时前
MyBatis-Plus 流式查询教程
前端·python·mybatis
用户412467508372 小时前
用 Locust 压测一个网站,记录一下学习过程
前端