每周分享(第 64 期)

214 阅读2分钟

新闻、观点、有趣

从 VSCode 看大型 IDE 技术架构
谈起 Web IDE,没人能绕开 VSCode,它非常流行,同时又完全开源,总共 350000 行 TypeScript 代码的巨大工程,使用了 142 个开源库。市面上选择基于 VSCode 去修改定制的 IDE 比比皆是:Weex Studio、白鹭Egret Wing、快应用IDE...

我希望从 VSCode 身上看到什么?

大型复杂 GUI 软件(如 IDE 类)如何组织功能模块代码 如何使用 Electron 技术将 Web 软件桌面化 如何在打造插件化开放生态的同时保证软件整体质量与性能 如何打造一款好用的、流行的工具软件

页面可视化搭建工具前生今世
页面可视化搭建, 是一个历久弥新的话题. 文章介绍的很全

真·复用组件 - React hooks 结合 RxJS 封装异步逻辑
聊聊 React hooks 如何改变旧有的开发思路,以及如何利用 hooks 结合 RxJS 将异步逻辑封装到组件中,从而轻松复用功能更复杂的组件。

教程、技巧

说说 JS 中的沙箱
业务代码上不执行不可信任的第三方JS,如有必要执行第三方JS,可通过设置CSP维护白名单的方式;不要信任任何用户数据源,防止恶意用户注入代码。

前端利用过渡动效打造沉浸式的体验
在Web页面中,流畅的过渡动效可以增加用户体验的舒适度,让用户认知过程更为自然,同时恰当的动效也能够引导用户关注重要的信息。在WeGame大屏模式需求场景中,笔者利用这个契机,在开发前期与视觉及动画设计同学沟通,设定好产品过渡动效及实现方式,给用户在体验中营造“沉浸式”氛围。

vscode 源码解析 - 依赖注入

Vue-SSR 优化方案详细总结

前端防御性编程
一个页面在呈现给用户之前需要经过静态资源加载、后端接口请求和渲染这三个过程,我们要做的就是在各个过程中防御可能出现的异常情况,保持流畅的用户体验,同时还要应对来自外部的攻击。

Mocking React hooks when unit testing using Jest

库、工具

Detect new DOM nodes using CSS selectors
Detect new DOM nodes using CSS selectors (650 bytes)

SingleFileZ
一个浏览器扩展,可以将网页和上面的静态资源打包成一个 zip 文件。