【实践经验】
1、钉钉表格，从零到一打造在线 Excel
https://zhuanlan.zhihu.com/p/340423350
本文是作者（2020 年 12 月 19 日）在 D2 前端技术论坛分享了钉钉从零到一打造在线 Excel 的故事的全文
2、从零搭建一款PC页面编辑器PC-Dooring
https://juejin.cn/post/6950075140906418213
在去年作者就开发好了面向PC端的编辑器PC-Dooring, 虽然在设计上还有些不足(在后面的内容中会提到)
, 但是基本模型已经实现, 接下来就和大家一起分享一下具体的实现.
为了保证文章整体的逻辑性和条理性, 作者将可视化搭建平台的具体的实现划分为了以下几个部分:
- PC编辑器效果展示
- 整体技术架构
- 可视化搭建技术实现方式
- 编辑器核心思路
- 编辑器架构模型
- 如何开发标准物料组件
- 编辑器后期规划
3、前端质量保证体系建设
https://mp.weixin.qq.com/s/5eKznqIkIf4-4AjbPwUR6w
本文核心要点
- 前端质量保证体系不仅仅是代码，不止于自动化。
- 深入研究探讨从需求到上线各个阶段的有效质量保证措施。
- 采取有效措施尽早发现缺陷、修复缺陷，甚至将缺陷扼杀在摇篮里。
- 将自动化测试深度融合到开发流程中，保证自动化测试的有效性与价值。
- 完善监控体系和回滚机制，守住最后一道防线。
- 通过快速试错快速成长和定期回顾，建设适合自己团队的质量保证体系。
4、用 JavaScript 实现三次贝塞尔动画库 - 前端组件化
https://mp.weixin.qq.com/s/b4vwIo4ua_o8uuM0L_BFLA
5、如何用纯 CSS 实现酷炫的霓虹灯效果？
https://juejin.cn/post/6949433605231738917
本文作者关注了油管上的CSS Animation Effects Tutorial系列，里面介绍了非常多有意思的 CSS 动效。其中第一个就是很酷炫的霓虹灯效果，这里就实现思路做一个简单的记录和分享。
【基础夯实】
1、loader 知识分享
https://mp.weixin.qq.com/s/58qVTSB8nPwqcMB-aegNyg
webpack 只能理解 JavaScript 和 JSON 文件，这是 webpack 开箱可用的自带能力。loader让 webpack 能够去处理其他类型的文件，并将它们转换为有效模块[1]，以供应用程序使用，以及被添加到依赖图中。loader 本质上是导出为函数的 JavaScript 模块。
2、深入浅出解析React Router 源码
https://mp.weixin.qq.com/s/hcAMubPlse4cK9y_-mS5yQ
本文会先用原生 JavaScript 实现一个基本的前端路由，再介绍 React Router 的源码实现，通过比较二者的实现方式，分析 React Router 实现的动机和优点。阅读完本文，读者们应该能了解：
- 前端路由的基本原理
- React Router 的实现原理
- React Router 的启发和借鉴
3、洞察设计模式的底层逻辑
https://mp.weixin.qq.com/s/qRjn_4xZdmuUPQFoWMBQ4Q
设计模式是开发同学经常聊到的话题，也经常被用到实际的开发项目中，熟练的人可以做到信手拈来，不熟悉的人陷入苦思冥想中。笔者认为，不仅仅要掌握设计模式的用法，更要洞察设计模式的底层逻辑，只有那样，才能做到遇到实际的问题可以使用合适的设计模式去解决。
4、探索v8源码：事件循环 Microtasks (微任务)
https://mp.weixin.qq.com/s/BUnuiZmc6jYQgPMuuyqAwQ
Microtasks（微任务）是事件循环中一类优先级比较高的任务，本文通过一个有趣的例子探索其运行时机。
5、冷知识！使用 display: contents 增强页面语义
https://mp.weixin.qq.com/s/IovseehWxSGE0R6rxcss8Q
【实用工具】
1、50 个让你高效编程的前端轮子
https://mp.weixin.qq.com/s/dGX3GN4gUWc5vMOyNd58MQ
2、我问导师，Vue3有没有对应工具来生成漂亮的文档？ 用 Vitepress
https://mp.weixin.qq.com/s/HWydUHElZLDoeHLjqeR1jA
Vue3和新的Vite构建工具为我们提供了另一种快速开发静态站点的方法，那就是Vitepress。
让我们来一起看看，如何使用Vitepress快速为Vue应用创建文档。
3、[译] 没有 UI 团队怎么办？分享 6 款能为独立网页开发者提效的免费工具
https://juejin.cn/post/6951207758997913636
4、可视化正则表达式学习神器！
https://juejin.cn/post/6951371753117941790
RegExr，一款学习、创建和测试正则表达式的在线可视化工具。通过在线练习的方式，很快就能帮助你学会正则表达式的基本语法，快速入门！
https://regexr.com/ 
【动态与研究关注】
1、Vue2 彻底从 Flow 重构为 TypeScript，焕然一新！
https://mp.weixin.qq.com/s/QPZusSE-70lBEJ_K5bv8KA
事情起源于 4 月 7 号晚上，尤雨溪在推特说，Vue2 收到了一个将整个代码库迁移到 TypeScript 的 PR。
去 Github 围观了一下chore: move to typescript 这个 PR[1]，基本上是 10w 行级别代码量的改动，把整个 Vue2 的代码库从原先的 flow 类型系统全部迁移到了 TypeScript，包括代码、构建系统、各种 lint 工具等等，恐怖的战斗力！
2、我所理解的 Hooks API
https://juejin.cn/post/6948974432341721102
3、带你解析微前端新方案-Module Federation
https://juejin.cn/post/6949798690135801864
webpack5模块联邦为我们提供了一种在应用程序之间共享代码的新方法。用白话来说，模块联邦提供了一种模块间共享代码的能力，为前端代码组织结构提供新的思路。
4、CSS @property，让不可能变可能
https://juejin.cn/post/6951201528543707150
@property CSS at-rule 是 CSS Houdini API 的一部分, 它允许开发者显式地定义他们的 CSS 自定义属性，允许进行属性类型检查、设定默认值以及定义该自定义属性是否可以被继承。
CSS Property如何使用呢？本文将通过一些简单的例子快速上手，并且着重介绍它在 CSS 动画中起到的关键性的作用，对 CSS 动画带来的巨大提升。
5、听说过CSS in JS，还有JS in CSS?
https://juejin.cn/post/6950209377403928584
【程序之外】
1、建立视觉层次的5个方法
https://mp.weixin.qq.com/s/sAXMo3gEm5dU26BiBfCa0w
用户浏览页面时，会在几秒内决定是要深入使用还是离开，一个清晰的视觉层次是一种吸引并留存用户注意力的方法。
2、腾讯文档-构建科学有效的色彩系统
https://mp.weixin.qq.com/s/LC1yGYTrdjCaUTGPtMMrbw
腾讯文档在色彩上也进行了一些深入的挖掘和沉淀，一方面希望带给用户全新的品牌印象和认知，另一方面构建科学有效的色彩系统，为产品的发展提供优质高效的设计系统基础。本文将聚焦于色彩系统的构建。
3、健康码的关怀模式—智慧政务的适老化设计
https://mp.weixin.qq.com/s/jOM0urDmDGo2V9gHmsovew
本文章通过电子健康码项目中的适老化设计，讲述了在政务行业中我们是如何帮助互联网时代的老年人消除数字鸿沟，让互联网产品更好地“适老”，不让老人“掉队”的。
4、沉入海底 2 年的微软数据中心浮出水面：故障率只有陆地上的 1/8，除了长点贝类和藻类完全没问题
2014年，微软首次提出了水下数据中心概念，当时认为这个概念有望为沿海人口提供高速云服务，并节省能源。
2015年，微软在太平洋开展为期105天的部署过程中证明了水下数据中心概念是切实可行的。
2018年，微软把一个数据中心沉入苏格兰北部冰冷的海底。
2020年9月份，微软将沉入海底经过两年试运行的数据中心从海床上捞了回来，研究人员对其进行了评估，得出的第一个结论就是：水下数据中心的服务器故障率比传统数据中心更低。
若有收获，就点个赞吧
0 人点赞
