- 博客(1709)
- 资源 (5)
- 收藏
- 关注
RSS订阅转载 出了兼容性问题，被领导叼了
Babel 提供了对 TypeScript（通过 @babel/preset-typescript）和 React 的 JSX 语法（通过 @babel/preset-react）的解析与转换能力，无需依赖其他编译工具。Babel 是一个广泛使用的 JavaScript 编译器/转译器，其核心作用是将 高版本 JavaScript（如 ES6+）转换为向后兼容的低版本代码（如 ES5），以确保代码能在旧版浏览器或环境中正常运行。@babel/preset-env 的参数项数量很多，但大部分我们都用不到。
2025-09-08 08:45:37
136
转载 移动端布局避坑指南：从100vh到dvh，彻底解决动态视口适配难题
但在移动端，情况却大不相同。在移动互联网浪潮下，前端开发者常常遭遇「桌面完美，移动翻车」的尴尬困境：精心设计的页面在手机端频繁出现内容截断、布局抖动，甚至因浏览器工具栏的显隐引发「位移惨案」。因此，在实际开发中，建议进行充分的测试，并为不支持这些单位的浏览器提供合适的备用方案，以确保页面在各种移动设备上都能有良好的显示效果。幸运的是，随着 CSS 技术的发展，我们有了更好的解决方案。但是，在移动设备上的表现就差强人意了，移动设备的视口大小会受动态工具栏（例如地址栏和标签栏）存在与否的影响。
2025-09-05 08:46:04
127
转载 通过代码看 React 的历史
他最初做了一个叫 “FaxJS” 的个人项目，后来改名为 “FBolt（Functional Bolt）”，再后来，它就成了 “React”。虽然大部分（大概 90%）广告相关的功能都可以用 Bolt 实现，但在项目中仍有一些情况，团队不得不脱离自己的框架，采用不太声明式的解决方案。多年来，我在使用 React 的过程中也一直有同样的疑问，直到某一天，突然恍然大悟。多年来聆听 React 核心团队的交流，再加上对这个工具演变过程的观察，终于让我彻底理解了它的设计逻辑。在 Web 的发展历程中由来已久。
2025-09-03 08:45:18
93
转载 作为前端Team Leader，我是如何做技术选型、项目排期和新人培养的？
硬要上React，那我得先掂量掂量，有没有时间搞培训，大家愿不愿意学，项目等不等得起。一个冷门的技术，可能文档都找不到几篇，遇到问题，谷歌都搜不到，那真是叫天天不应。但看的目的不是为了批评他，而是借着他的代码，告诉他我们团队的编码规范是什么样的，为什么要这么写。我刚工作时就遇到过这种，一个人对着一堆过期的文档，两眼一抹黑，连个问题都不知道该问谁，那种无助感现在还记得。以前自己写代码，好坏都是自己的事，代码烂了，加班补上就行。当老板找我谈话，说想让我带前端团队的时候，说实话，我第一反应是“完了”。
2025-08-28 08:45:47
67
转载 2025 年现代 Node.js 开发模式
现代的 Node.js 更加拥抱 Web 标准，减少对外部依赖的需求，并带来了更直观的开发体验。通过采用这些现代化模式，你写下的代码将不仅更具现代风格，还更容易维护、性能更优，同时与更广泛的 JavaScript 生态系统保持同步。流（Streams）一直是 Node.js 最强大的特性之一，如今它们已经演变为更加符合 Web 标准的形态，并提供了更好的互操作性。这种写法摆脱了过去到处可见的 “立即执行的异步函数（IIFE）” 模式，让你的代码更加线性、逻辑更清晰，也更容易理解。
2025-08-26 08:45:24
172
转载 Proxy 有哪些东西是无法拦截的？深入解释 Reflect 与陷阱盲区
是一把极其强大的API，允许你劫持对象的读取、赋值、删除、函数调用等等。保留了原始对象操作的行为语义，确保原型链正确、上下文正确（特别是 setter / getter 中的 this）。这是一个非常冷门的行为，通常只有你在 try-catch + sandbox 时才会踩到。要改变 instanceof 的行为，只能返回一个特殊的构造器对象。，甚至有些你以为能拦的操作，背后根本就没调用 proxy。除非你拦截的是一个函数调用的属性访问阶段，否则基本无解。是静态操作，不触发运行时 hook。
2025-08-25 08:45:50
59
转载 Vue3 + 一个冷门 API，实现了浏览器多屏投屏，效果太惊艳了！
看着这个图的第一时间我就去找产品掰扯，想让他把这个功能pass掉。我在想浏览器怎么访问到系统的参数。当我去翻阅文献的时候发现国外有大佬做出来了这个功能而且很全面。但是使用原生的html写的。我决定参考他的demo把他搬到大屏的项目里头。最近接了个大屏项目，产品想在不同的显示器上展示大屏项目不同的页面，做出来的效果图大概长这样。链接：https://juejin.cn/post/7490588889947865142。vue组件代码就很简单了就不展示了。在指定的显示器新开一个窗口。
2025-08-20 08:45:15
76
转载 前端如何管理JS内存
在前端开发中，管理 JavaScript 内存是优化性能、减少内存泄漏、提升用户体验的重要一环。如果 JavaScript 对 DOM 元素的引用未及时清理，即使 DOM 已被移除，内存仍然会被占用。：JavaScript 引擎（如 V8）会自动回收不再使用的内存（通常基于引用计数或标记清除算法）。确保闭包引用的变量是必要的，及时清理不需要的闭包。理解 JavaScript 的内存管理机制，避免常见的内存泄漏场景。虽然垃圾回收是自动的，但开发者仍需避免不必要的内存占用和泄漏。
2025-08-18 08:45:15
79
转载 蔚来面试题：计算白屏时间
在这段时间内，用户看到的只是一个空白页面，因此白屏时间的长短直接影响了用户的体验。：HTML文档的大小、复杂度、外部资源的加载顺序等都会影响白屏时间。白屏时间是前端性能优化中的一个重要指标，直接影响用户的体验。如果网络状况不佳，DNS解析和TCP连接建立的时间会变长，从而导致白屏时间增加。测量白屏时间的方法有多种，下面介绍两种常用的方法：基于时间戳的方法和基于Performance API的方法。白屏时间是指从用户发起页面请求到浏览器首次开始渲染页面内容的时间。两者的差值即为白屏时间。
2025-08-14 08:45:24
96
转载 vite插件: 自动打包压缩图片和转webp
因为用vite打包工具，就去社区找相关插件，可没找到一个比较符合我要求的，就打算自己工作摸鱼写一个吧👀。有人可能认为，开发环境并不需要压缩和转webp功能，其实不然，开发环境主要是为了看图片处理后的效果，是否符合预期效果，不然每次都要打包才能看，就有点麻烦了.: 还是在generateBundle中，直接copy一份图片的chunk，替换chunk的source和fileName，再添加到bundle中输出。**：这里就有点麻烦，需要考虑图片的引入方式和打包的产物，解析产物去替换了。
2025-08-12 08:46:03
72
转载 响应式机制的未来：Signal 与现代前端框架
我们都知道 React 在状态发生变化的时候，会重新渲染整个组件，使用 useMemo 可以减少渲染，但一旦判断需要更新，都至少会重新渲染整个组件，Singal 在这一项优势，也是很多框架选择它的原因，当然 Singal 还有很多其他的优势。Svelte3 响应式更新是也是组件级别的。目前来看，一个现代的框架，核心逻辑大多是通过写声明式的 UI，通过响应式机制来实现页面的更新，响应式机制是框架的核心，它定义了数据与 DOM 的交互方式，还决定了框架的性能上限，下面就来谈一谈前端的常见的几种响应式机制。
2025-08-11 08:45:51
108
转载 一份完整的「高级前端性能优化」手册
浏览器在解析 HTML 的时候，如果遇到一个没有任何属性的 script 标签，就会暂停解析，先发送网络请求获取该 JS 脚本的代码内容，然后让 JS 引擎执行该代码，当代码执行完毕后恢复执行后续解析。因此，我们可以将每个页面路由组件，拆成单独的一个个 chunk 文件，这样 main.js 文件体积降低，在首屏加载时，不会再加载其他页面的资源，从而提升首屏渲染速度。例举一个常见的场景：在 CSR 客户端渲染中，如果 main.js 资源体积过大，会导致在资源加载完成以前，页面会出现长时间的白屏。
2025-08-07 08:46:04
109
转载 人人都需要一个 HTTP proxy 来 debug
每当接 API 出问题时，就按下快捷键打开 DevTools，切到 Network 分页，找到红色的那一行，右键复制成 cURL 粘贴到群里面，让后端自己找找问题。以上是两个我有印象的范例，但实际开发中应该碰过更多更多，基本上都是只靠 DevTools 来看 Network 没办法解决的问题，要么是看不到，要么看到的东西不太对。除了电脑的网页之外，手机也可以使用，可以在 Android 上设置代理服务器连接到同一个 Wi-Fi 的电脑上，接着在手机上安装证书，就能够拦截手机的流量。
2025-08-04 08:46:04
69
转载 跨过前端工程化建设的三座大山
比如 .vue 结尾的文件需要转换成 .js 结尾才能被浏览器识别，.less 结尾的文件需要转换成 .css 结尾的文件，.css 结尾的文件需要转换成 style 标签 ...启动 devServer 的时候，可以将打包构建的其他代码放入内存，将双向通信的代码片段注入模板文件，当启动模块页的服务时就能建立与 devServer 双向通信的桥梁。开启 devServer 去热更新，需要具备两种能力，一种是监控文件变化的能力，一种是通知页面可以去更新代码的能力。这里无论是哪种构建工具都可以实现这三个阶段，
2025-07-31 08:45:25
48
转载 简单盘点下前端日志采集的几种方式
对象，把要上报的数据编码到请求 URL 的 query 参数中，然后加载一个 1x1 的透明 GIF 图片（当然不需要真的返回一张图，后端 204 也行），重点是通过src请求资源的同时，让服务端记录.gif后的数据。前端日志采集，说简单也简单，说复杂也复杂，取决于业务想要什么粒度的数据，以及开发者能接受多少侵入性、延迟和兼容性问题。专门为这种场景设计的 API，可以在页面卸载（比如跳转、关闭）时，异步且可靠地把数据发送到服务器，不阻塞页面卸载流程。兜底，再加一些重试机制，做到不丢、不卡、可靠。
2025-07-29 08:45:52
87
转载 别再写一堆 if-else 了：用状态模式优雅管理状态行为
在使用前要权衡问题的复杂度。但想象一下，如果手机有十几种模式，每种模式还要影响多个行为（比如来电、短信、闹钟、通知等），那么条件分支会迅速增多，而且每种模式的逻辑会分散在代码中的各个 if 语句里，维护起来就非常容易出错。许多框架和库在内部使用状态模式或类似的概念（例如，用户界面组件通常具有启用 / 禁用 / 悬停等状态，这些状态在幕后通过状态对象或状态模式来实现）。当你切换模式时，实际上就是更换状态对象，这样就避免了大量的条件判断，而是依靠多态来实现 —— 每个状态类知道在该状态下该如何处理具体的动作。
2025-07-28 08:46:05
76
转载 2025年了！前端项目中代码格式还没统一？
在项目开发过程中代码统一是至关重要的，不然每次接手其他人的代码，第一眼过去就是 shit code ，不得不在动手修改前先格式化代码；试想一下，你从代码仓库中拉取代码在 vscode 中保存一下，结果全是修改，你只是保存了一下并没有修改，而后续你的修改也埋在当中，于是不得不先提交格式化修改....反复下去就是 shit code。是一个流行的代码格式化工具，旨在通过自动应用一致的代码风格来提高代码可读性和开发效率。对于一定规模的项目，毫无疑问是多人开发的，如果项目中的代码风格不统一，非常影响心情。
2025-07-24 08:45:45
126
转载 vite构建优化，速度提升了73% & rollup拆包8.4M降低至1000kb
问题三、rollupOptions.output.manualChunks 拆包不合理。json文件不参与构建，缩减构建时间，减少js文件体积。全局注册的组件不会被Tree Shaking.参考。其中①-⑫是其他场景下，需要引入的json文件。问题一、json静态资源使用import引入。，导致json文件被解析成js chunk.vendor.js拆分多个小文件。静态资源(json文件)提取至。全局组件注册，会导致全量构建。入口文件custom.js。插件分析，查看模块组成。其他组件按相同方式处理。
2025-07-22 08:45:30
90
转载 stagewise：让AI与代码编辑器无缝连接
Stagewise 是一个旨在提高开发效率的工具，它允许 Cursor、GitHub Copilot 和 Windsurf 等工具与浏览器交互，支持对任何 DOM 元素进行注释，并将实际上下文发送给 Windsurf，提供了一种时间节省的方法，减少手动选择文件的需要，支持 React、Next.js、Vue 和 Nuxt.js 等框架。stagewise 是一个创新的浏览器工具栏插件，它将前端 UI 元素直接连接到你的 AI 代码助手，帮助开发者节省时间、减少重复操作。安装后即可立即使用，无需复杂配置。
2025-07-21 08:45:43
173
转载 常见的 React 库架构设计
这么做有一个好处，就是可以避开 React 的重新渲染周期，也无需关注 React 的记忆优化机制（memoization）。其中，处理 Suspense 和 Promise 的原始 hook 会被大量使用，但在某些场景下，也可能需要用到更多的新 hook。不过，这种行为在某些场景下是你想要的，因为它可以避免 “撕裂”（tearing）—— 也就是组件使用了旧的状态数据。虽然 React 在并发特性中默认允许某些状态撕裂，以优先渲染更重要的内容，但对于外部状态，React 认为撕裂是不好的。
2025-07-17 08:45:15
69
转载 Mobile Bridge：让 WebView 拥有原生体验
Mobile Bridge 彻底改变了我们对 Web 与移动集成方式的看法 —— 它让我们可以拥有 Web 开发的灵活性与速度，同时为用户提供接近原生的流畅体验。在这篇文章中，我们会分享我们是如何解决传统 WebView 在性能、外观和集成方面的主要问题，以及 Mobile Bridge 如何成为我们移动开发策略中的关键工具，甚至帮助我们加速向 React Native 的迁移。Web 页面中的弹窗通常是覆盖在当前内容之上的，而在移动应用中，弹窗通常作为独立的屏幕出现，并伴随原生的过渡动画。
2025-07-15 08:46:03
78
转载 前端 button 组件之按钮式进度条
在一些前端项目中，它们会涉及文件的上传 / 下载 功能，当文件在进行上传 / 下载时，我们该怎么更好的向用户进行进度反馈呢？，分别是进度条元素，图标元素，文本元素，我们将按钮设置为相对定位，将进度条元素设置为绝对定位，利用。到了这里，我们已经完成了进度条效果，但对比效果图还是差了那么一点点，当进度条到。通过对比上面三个图标元素，我们发现它们都有共同的类名为fa，而不同的是后面。很快，我们按钮的基本样式已经写出来了，接下来我们先实现进度条效果，在。元素添加点击事件，当按钮被点击时我们将按钮的。
2025-07-14 08:45:57
75
转载 Vite打包优化实践：从分包到性能提升
随着前端应用功能的增加，项目的打包体积也会不断膨胀，影响加载速度和用户体验。本文介绍了几种常见的打包优化策略，通过Vite和相关插件，帮助减少项目体积、提升性能，优化加载速度。，只在对应功能模块中使用，可以单独打包出来，用户使用对应功能，才会下载对应js脚本。属性，阀值设置为 20 KB，模块大小，大于20kb的才会单独打包成chunk。插件将外部依赖映射为全局变量，避免将其打包进最终文件，减小文件体积。插件，是一个可视化工具，以图表的形式，展示打包结果的模块构成与体积分布。自动注入代码到HTML文件中。
2025-07-11 08:45:35
299
转载 面试官：前端批量请求失败 Toast 重复弹窗怎么解决？
"放弃第三方toast库的自动去重功能，选择自研方案以保持轻量（包体积减少30KB）"✅ 高情商表达："通过协商制定重试策略+服务降级方案，建立前后端错误处理SOP""弹窗触发率降低98%，错误分类准确率提升70%，该方案被复用到订单中心模块""输出《前端错误处理规范》，推动团队建立统一拦截器，减少重复开发量""在电商结算页的批量请求场景中，5个接口并发请求面临网络波动风险""弹窗频率从3次/秒降为0.1次/秒，错误日志上报量减少85%""需要保证多个接口失败时，用户不被重复弹窗干扰"
2025-07-08 08:45:33
113
转载 前端也需要了解的 MCP 知识
随着越来越多的公司在招聘前端的时候，加入AI相关的技能要求，建议大家还是随时关注AI领域的最新技术发展，虽说现阶段AI还不会替换掉我们，但AI辅助编码基本已经正在成为各个公司的主流方向，对AI了解的越多，越能提高我们在新的AI时代的竞争力。就像上边的那张图片 MCP 提供一种标准的接入协议,只要是按照 MCP 开发的服务端就可以在 MCP 客户端中接入(这他么不是废话吗!这里实现两个简单的 MCP 服务一个时间时间工具 和 简单的 GitHub 搜索,把官网 MCP 服务端的两种写法都实践一些。
2025-07-07 08:45:40
108
转载 Cursor 内部工作原理
Cursor 会将你的问题转为一个向量，然后在向量数据库中查找最相近的片段，可能包括多个文件中的函数调用、定义、注释等。即便你配置了自己的 OpenAI API 密钥，请求仍会先经过 Cursor 的后端，这样系统才能添加系统指令、代码上下文以及专属格式，确保模型理解你的需求。介绍了 Cursor，一个结合了 AI 技术的代码编辑器，它通过深度学习和语义索引的方式，提升了开发者的工作效率。Cursor 通过与 VS Code 相似的界面和功能，以及自己的 AI 特性，实现了代码的智能化编辑和错误检查。
2025-07-04 08:45:53
100
转载 记录一次前端项目代码Review
如图, 这个用来格式化时间的工具函数被定义了三次, 如果不凑巧, 在你需要修改这个函数的时候不知道它被定义了3次, 仅更改了其中一个函数, 你以为你更改了代码的行为, 但是那些引用其他位置函数的代码还是原来的逻辑, bug就这样被制造了出来...作者最近从别的团队接手了一个长期维护的项目, 因为项目经手的开发人员多, 代码管理不到位, 再加上开发周期紧张, 定制化需求多等问题, 导致项目内冗余代码过多, 代码质量参差不齐, 项目难以继续维护, 所以开始。
2025-07-02 08:45:28
45
转载 前端组件解耦利器：发布订阅模式
虽然像 Redux, Vuex, Pinia 这样的状态管理库有自己的机制，但有时在它们之外，或者在不使用这些库的小型项目中，可以使用 Event Bus 来响应某些状态相关的变化，通知相关组件更新。因此，在使用时需要权衡利弊，遵循最佳实践（特别是取消订阅），并避免滥用，将其用在最适合的场景（如复杂的跨组件通信、模块解耦等），才能真正发挥其价值。这些组件之间经常需要通信和协作。它通过引入一个中介（事件总线），使得组件间的通信可以间接进行，降低了组件之间的依赖关系，提高了代码的可维护性和可扩展性。
2025-07-01 08:45:42
68
转载 Tauri vs. Electron：性能、体积与真实权衡
虽然 Tauri 的主进程是用 Rust 编写的，但在 Hopp 中，我们还需要一个额外的进程（即 “Sidecar”）来处理屏幕视频流以及远程控制的输入（如点击和键盘操作）。说到底，其实没有唯一正确的答案。对于性能要求更高的任务或更深入的系统级交互，通常需要启动一个额外的进程，并通过进程间通信（IPC）或类似 Unix 套接字的方式与之交互。在 macOS 系统上，对于相同的窗口，基于 Chromium 的 Electron 渲染器进程所消耗的内存大约是 Tauri 的 WKWebView 进程的两倍。
2025-06-27 08:45:21
246
转载 用分层结构扩展你的 React 项目
所以当我接下来参与的项目转向使用 React 时，我感到非常惊讶，因为 React 几乎没有针对大多数开发者的官方库，也没有一个成文的风格指南可供参考。Layered React Structure（LRS）是一种旨在清晰分层、高效开发和维护大型 React 项目的方法论，强调组件和逻辑的分层组织，以及如何在 React 项目中更好地测试和样式管理。关于 “智能” 组件和 “傻瓜” 组件的争论有很多不同的说法，但以下是我在实际开发中总结的一些通用经验法则。我建议你在使用 LRS（分层结构）时遵循这些规则。
2025-06-24 08:45:50
53
转载 前端内存泄漏：你的JS代码在偷偷“吃”内存！
任务管理器一打开，浏览器占用的内存高得离谱，就像一头无底洞的野兽，吞噬着你的RAM，直到你的电脑风扇狂吼，最后页面直接崩溃。当你的页面越来越卡，用户体验崩溃，你才发现是“隐藏的内存炸弹”在作祟。因此，养成良好的代码习惯，定期检查内存占用，才能让你的应用流畅运行，告别“卡成PPT”的尴尬局面！今天，我们不讲废话，直奔主题，带你彻底搞懂前端内存泄漏的成因、定位、解决方案，让你的代码更优雅，不再成为用户电脑的“内存杀手”！“哥，等你页面打开半小时，Chrome开始吃掉你所有的RAM，你就知道怕了……
2025-06-23 08:46:05
65
转载 一个前端面试官的思考：当Promise遇上真实业务场景
作为一名前端面试官，我经常遇到这样的候选人：聊 Promise API 的时候说的很溜,我感觉我都没他这么溜，然后再问实际的 Promise 业务场景的时候就不会说了。"你对Promise熟悉吗？Promise.all、Promise.race、Promise.any..." "好的，那我们来看一个实际场景..."通过这个例子,我们可以看到: 知道API的使用，并不意味着你就会用。"假设用户要上传100张图片，但是服务器限制同时最多只能处理5个请求，你会怎么处理？queue : 存储待执行的任务队列。
2025-06-20 08:45:43
48
转载 实战！从 0 到 1 搭建 H5 AI 对话页面
起初，我打算借助 UniApp 现成的插件快速完成，可深入了解后发现，这些插件无法满足项目需求，于是踏上了自主开发的征程。SSE 全称 Server - Sent Events，能让服务器实时推送更新到客户端，特别适合 AI 对话场景，实现逐字返回对话结果，给用户带来流畅的交流体验。虽然领导没要求，但我看到腾讯元宝在流式输出文本时的自动滚动和手势拖拽功能，觉得很实用，决定在项目中实现类似效果。最初，我计划在前端实现语音转文字。但老板是福建人，方言复杂，担心前端识别准确率低，便放弃了这个想法。
2025-06-18 08:45:56
217
转载 埋头苦干Vue3项目一年半，总结出了16个代码规范
合理的使用响应性变量。数据量很大的对象或者数组，同时属性又是嵌套的对象，你的业务场景只需要第一层属性具有响应性，推荐使用shallowRef和shallowReactive定义响应性变量，这时不在推荐使用ref和reactive了。在项目或者开发过程中，尽量使用let或者const定义变量，可以有效的规避变量提升的问题，不在赘述，注意const一般用于声明常量或者值不允许改变的变量。另一个常见的问题是：console打印和debugger之类的，虽然说可以通过插件配置在打包的时候删除掉，但是官方提倡的是。
2025-06-13 08:45:23
131
转载 Nextjs首屏加载速度性能从80分优化到98分
css使用的tailwind.css库内部对css做了处理优化, 进行不使用style些内嵌样式,提高编译速度( 首屏不需要的组件可使用lazy-load包来做懒加载处理 加快渲染速度 )google控制台的performance来录制首屏加载过程的文件时长以及阻塞情况,避免一些首次加载无须展示的组件的优化。在根文件加载脚本时 如果当前时外部页面则不需要此wasm不加载它 避免没必要的加载 来优化首次加载速度。可以使用nextui提供的Image,它提供对图片进行不同屏幕的适配尺寸,以及懒加载功能。
2025-06-11 08:45:40
104
转载 【AI入门】MCP Server初探
在看了一些介绍后，恰巧之前通过 Ollama 也部署了本地大模型，正好可以试试本地 MCP，兴许可以「以后 自己开发些 MCP，然后通过本地大模型调用」，这样就能摆脱 UI、Terminal 来执行特定的操作了~~这是一个本地大模型的客户端，以便配合 Ollama 来使用本地大模型。大模型火了一阵子了，最近又火了一个技术 —— MCP。3.2、创建&初始化一个 MCP项目。4.3、在对话中启用 MCP 服务器。4.1、添加 MCP 服务器。2.1、安装 Ollama。3.3、开发&调试 MCP。
2025-06-09 08:45:37
71
转载 “内聚编程”的兴起——复制粘贴或许是前端的未来
介绍了 “内聚编程”（Cohesive Programming）的概念，并探讨了这种新兴趋势如何可能成为前端开发的未来，即使它可能与传统的 “关注分离”（Separation of Concerns）原则相冲突。与传统的 “关注点分离”（Separation of Concerns） 相反，这种方法强调通过将相关元素集中在一起，提高代码的内聚性。将数据层与视图层分离。iOS 和 Android 仍然深度绑定于官方工具和开发模式，尤其是 Apple 生态，它更倾向于 “正确的做法”，而不是开发者的自由度。
2025-06-03 08:46:05
49
转载 如何微调和修改前端依赖包
替换依赖比较适合被更改的依赖比较底层,还有更改内容较多,还会编译出文件,这里介绍。的仓库代码,并把自己需要的功能加上,更改。, 这样在项目安装依赖完成后会执行这个脚本。, 这样在项目安装依赖完成后会执行这个脚本。3.3 更改完成后,把这个包构建并发布到。3.4 在要替换的项目中安装修改的这个依赖。阶段去替换现有的文件,或者替换字符串;通过下面的配置,这样项目中使用到。脚本替换处理是比较粗糙的替换手段。把原本依赖替换成新的依赖包;2.2 修改依赖文件,并生成。修改我们要更改的依赖包如。1.1 替换脚本编写。
2025-05-27 08:45:30
65
转载 深入解析前端插件机制：以埋点SDK与Webpack为例
最近在做前端监控的全链路项目, 刚好埋点SDK这边的架构设计需要用到插件机制, 就想着和之前学过的webpack插件机制进行一个类比, 看看有哪些共通和差异之处。在现代软件开发中，插件机制是实现系统扩展性和灵活性的核心设计模式之一。插件机制通过将核心功能与扩展功能分离，使得系统能够在不修改核心代码的情况下扩展能力。：ByteTop 的监控场景要求“永不中断”，Webpack 的构建场景允许“快速失败”。为例，深入探讨两者的插件机制设计异同，并揭示其背后的设计哲学。
2025-05-26 08:45:27
65
转载 前端面试题：浏览器两个 tab 都是同域，如何在一个tab 向另一个 tab 发消息
兼容性良好（支持 Chrome 54+、Firefox 38+、Edge 79+）。选择方案时需根据具体需求（如兼容性、数据复杂度、窗口关系）权衡。通过 Service Worker 作为消息中转站，实现跨 Tab 通信。现代浏览器提供的专用通信 API，允许同源页面通过命名频道通信。事件，其他同源页面可以监听该事件实现通信。直接支持结构化数据（对象、数组等）。需要直接引用目标窗口对象（如通过。，只有其他 Tab 会收到事件。受同源策略限制，仅限同域页面。复杂场景（如离线、后台同步）
2025-05-23 08:46:04
81
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人