5. 如何优化前端性能？

#牛客AI配图神器#SPA代表单页面应用，而MPA代表多页面应用。它们是两种常见的前端应用架构方式，有以下区别：https://www.nowcoder.com/issue/tutorial?zhuanlanId=Mg58Em&uuid=07d53be4cd034a4ab270d500feebcc8d🌐💌页面加载方式：SPA：SPA只有一个HTML页面，当应用初始化时，加载该页面，并通过JavaScript动态地加载内容和更新页面。用户在使用过程中，在同一个页面上浏览和交互，无需每次都重新加载整个页面。MPA：MPA由多个HTML页面组成，每个页面都有自己的URL。每次点击链接或刷新页面时，都会从服务器重新获取整个新的HTML页面以更新内容。🌐💌页面切换体验：SPA：由于不需要重新加载整个页面，SPA可以提供更快的页面切换体验。它使用JavaScript和Ajax技术，通过异步请求数据并更新页面部分内容，实现页面之间的平滑切换。MPA：MPA在页面切换时需要重新加载整个页面，因此会出现页面之间的闪烁或延迟，用户体验较低。🌐💌数据交互：SPA：SPA使用AJAX技术从服务器异步加载数据，并通过JavaScript动态更新页面内容，实现与后端的数据交互。通常使用RESTful API进行数据传输。MPA：MPA每次加载页面时，会从服务器获取完整的HTML页面和对应的数据，页面之间的数据传递通过URL参数或表单提交。🌐💌开发与维护：SPA：SPA通常使用前端框架（如React、Angular、Vue.js）来实现，需要掌握JavaScript框架和相关技术。其开发和维护相对较为复杂，但能提供更好的用户体验和交互效果。MPA：MPA传统而直观，按照每个页面独立开发的方式进行，易于理解和维护。相对于SPA，可采用多种技术栈，例如HTML、CSS、JavaScript等。🌐💌综上所述，SPA和MPA在页面加载方式、页面切换体验、数据交互和开发维护等方面存在明显的区别。选择哪种应用架构方式取决于具体的项目需求和技术要求。

叠纸前端一面面经描述一种方法，用以实现一个动态加载内容的无限滚动列表。如何使用CSS实现一个动画，当用户鼠标悬停在按钮上时，按钮逐渐变大？在React中，如何优化组件以避免不必要的重新渲染？如果你有一个含有数百个项目的数组，你将如何有效地搜索特定项目？解释一下Web Accessibility（Web无障碍性）并举例说明如何在网页设计中实现它。使用JavaScript，如何创建一个倒计时计时器，显示天、小时、分钟和秒？我们的游戏界面需要实时更新玩家的得分，你会如何设计前端架构来实现这一功能？解释什么是服务工作线程（Service Worker），以及它可以如何帮助提高一个游戏网站的性能？请描述...

千分位分隔，一维数组转二维。基本就是简单的聊天，问些基础的八股。#牛客AI配图神器#

今日总结：计算机网络部分的知识还有vue相关的一小块知识。vue部分的还没写好。目前就是知识点还是不够深入吧，都浮于表面，每天都学不完。八股，手撕，算法，项目。好难待办：整理打包工具知识点vue部分的知识点整理项目的难点继续力扣+手撕希望下周有面试希望有心软的面试官我也想实习计算机网络TCP和UDPUDP 和 TCP 协议的区别？有什么应用场景TCP三次握手和四次挥手三次握手为什么不是两次握手？TCP可靠：解决丢包问题和乱序问题四次挥手为什么不是三次挥手在状态方面HTTP协议HTTP⾸部字段?一次http请求过程HTTP状态码HTTP 报⽂组成部分常...