荣耀软开前端方向一面9.16

1、压缩Css和JavaScript文件。2、启用gzip压缩技术，减小服务器传输数据大小。3、利用浏览器缓存技术，将静态资源设置为长期缓存，减少请求次数。4、将Css放在head标签中，将JavaScript放在body底部，优化页面加载时间。5、使用CDN加速服务，分布式部署静态资源能减少服务器的请求压力以及网络环境对网页的影响。6、尽量避免使用大量图片，图片应该优化，压缩等前端操作。7、尽可能合并Css和JavaScipt文件以减少HTTP请求次数。8、使用异步加载 JavaScript 脚本文件技术可以降低对页面的阻塞。9、保持简洁的代码结构和逻辑。 尽可能压缩HTML代码。10、根据具体情况分别选择HTTP 1.0 和 HTTP 1.1 的协议，并开启Keep-alive选项来复用TCP连接。https://www.nowcoder.com/issue/tutorial?zhuanlanId=Mg58Em&uuid=43521d43a8e341f888324dd690363024

听说今年好多公司都是这样？ #校招# #秋招# #笔试# #华为# #字节# #腾讯# #百度# #美团#

#改简历# 真诚请教怎么完善简历，感觉有很多东西都没写，但是根本不知道怎么写，还需要学习什么更深入的知识吗，只会这些是不是只能面一些中小厂，谢谢 #前端# #你都收到了哪些公司的感谢信？# #我的简历长这样# 引流 华为 美团 饿了么 阿里 网易云 

        一直面试只能让你把会的背的更熟，但想进步还是得回头看看不会的问题。        今天回顾一下我遇到的一些有价值的问题，结合我自己的一些理解对这些问题尝试解答一下，相信对大家一些知识的理解也会有些帮助（有问题的话欢迎指出）。有用的话感谢大家点赞收藏送花~1.（滴滴提前批二面）Vue开启了keep alive之后会经历哪些生命周期？缓存了什么东西？        这个点我自己是没有仔细思考过的，当时面试官提问vue的生命周期，我提到了Vue开启keep alive前后生命周期的不同，面试官拓展的问了这个问题。        背八股的时候都背过，使用组件包裹后可以在切换路由的时候不必销毁组件。并且会多出两个生命周期：activated和deactivated。其中activated在组件渲染的时候执行，deactivated在组件隐藏时执行，因此将这两个生命周期对比mounted和beforeDestory来学习。组件在初次渲染的时候会经历从beforeCreate到mounted这整个阶段，在后续切换的过程中则只会经历activated，随后的beforeUpdate和updated都会经历，隐藏时经历deactivated，最后销毁的时候才会经历beforeDestory和destoryed。        那么缓存了什么？我们知道在mounted阶段，虚拟DOM转为真实DOM，此时data，method，虚拟DOM都有了；而activated阶段可以不经历前面的钩子，直接挂载DOM，说明keep-alive缓存了虚拟DOM，并且还有所有的数据/方法，也就是缓存了组件实例。        如果面试阶段没有见过这个题，可以从每个生命周期干了什么开始联想，其中走到mounted阶段拥有了什么，那么actived阶段就也会有这些。2.（4399一面）http1.1的情况下，一个网页的图片是一张一张加载还是一批一批加载的？        首先回顾一下http1.1的特性：    ● 默认长连接，新增响应头Connection：keep-alive字段，保持TCP连接不断开    ● 管道化：基于上面长连接的基础，管道化可以不等第一个请求响应继续发送后面的请求，但响应的顺序还是按照请求的顺序返回    ● 缓存处理：新增catch-control字段    ● 断点传输机制。文件传输时如果遇到网络故障，可以从已经上传/下载好的地方继续请求，不用从头开始        其中第二点提到的管道化基本可以解答整个问题，虽然可以发送多个请求，但是返回的顺序还是有序的。因此虽然TCP最大连接数有6~8个，但是返回时还是顺序返回的。        但是需要注意，如果严谨一点的话还是要考虑一下预加载的情况。例如，当浏览器解析到 HTML 中的标签时，它可能会提前发起对指定资源（包括图片）的请求，这样在真正需要显示该图片时，可能已经加载完成或者部分加载，从而在一定程度上出现看似一批加载的情况。3.（Minimax一面）eval和new Function的this指向问题：        eval的this指向可以看这篇，很详细：https://ayk.moe/articles/javascript-change-this-in-eval-function/index.html        简单的说：eval函数只要是在全局直接运行或者是通过一个函数调用执行、作为对象属性被调用执行这种间接的执行方式，他的指向都是全局作用域。他不能直接被call/bind/apply改变this指向，改变的思路是在eval外面包一层函数，改变外面这个函数的this指向。        new Function：使用 new Function 创建的函数，它的 [[Environment]] 指向全局词法环境，而不是函数所在的外部词法环境。因此，我们不能在 new Function 中直接使用外部变量。        如果你对这块不熟悉，来看看这个：https://zh.javascript.info/new-function4.（Minimax二面）React：在if else里书写hooks，为什么不可以？        我用我自己比较容易理解的话术来简述一下关键原因，这里面的具体细节还是比较复杂的，有兴趣的牛u可以找找资料了解一下。        react的fiber树有两颗：        current fiber树: 当完成一次渲染之后，会产生一个current树,current会在commit阶段替换成真实的Dom树（可以看成虚拟dom转真实dom）。        workInProgress fiber树: 即将调和渲染的 fiber 树。再一次新的组件更新过程中，会从current复制一份作为workInProgress,更新完毕后，将当前的workInProgress树赋值给current树。        workInProgress tree上有一个memoizedState属性，在函数组件中，memoizedState在一次调和渲染过程中，以链表的形式存放hooks信息。        每一个hook函数执行，都会产生一个hook对象，里面存放了hook的当前信息，然后会以链表的形式串联每个hook对象，并赋值给workInProgress的memoizedState。        每次组件更新的时候，会先复制一份current tree到workInProgress tree，此时在workInProgress上进行更新。一旦在条件语句中声明hooks，在下一次函数组件更新，hooks链表结构，将会被破坏（某个节点可能被跳过），current树的memoizedState缓存hooks信息，和当前workInProgress不一致，如果涉及到读取state等操作，就会发生异常。                以上很多是自己的理解，可能讲述不准确但有助于自己理解，欢迎评论区留言指出错误~#面经##前端##滴滴##4399##minimax##24届软开秋招面试经验大赏#