【实践经验】
1、十亿级流量的搜索前端，是怎么做架构升级的？
https://mp.weixin.qq.com/s/cbPDWjOC3iDPyg1DUkcyoA
前端发展飞速，从最开始的静态页面到 JavaScript，再从 PC 端到移动端，随着大前端的复杂度不断提升，很多公司开始前后端分离，剥离出前、后端架构设计。那我们来看看，前端架构设计是什么？曾经非常简单的前端架构发展到现在有哪些问题，遇到前端代码体量巨大、跨团队协作效率、代码耦合、技术栈落后等问题又该怎么解决？
本文通过百度移动端的架构升级案例给出了解决方案。
2、门神——转转前端代码校验系统
https://mp.weixin.qq.com/s/o7M1bXwFM54GyviCUT2CnA
本文介绍了转转前端团队开发的一个在编译 & 部署环节可以通过静态扫描，发现并拦截含有不安全代码的项目上线的系统的设计思路及实现方案。
3、开发者怎样才能写出好的 API？
https://mp.weixin.qq.com/s/3nFWS1sx-yOu6aDYr9TcmA
API 最早开始流行于大约 20 年前。2000 年，Roy Fielding 在他的博士论文中首次提出了 REST 这个术语。同年，Amazon、Salesforce 和 eBay 向全世界的开发者介绍了他们的 API，永远改变了我们构建软件的方式。
通过阅读本文你会看到如何确定你的 API 是否成熟，好 API 的主要品质是什么以及为何在构建 API 的时候，要注重适应性。
4、前端异常的捕获与处理
https://www.zoo.team/article/catch-error
按键无法点击、元素不展示、页面白屏，这些都是我们前端不想看到的场景。在计算机程序运行的过程中，也总是会出现各种各样的异常。本文介绍了前端常见的异常情况以及怎么处理它们。
5、改善代码可读性的5种方法
https://mp.weixin.qq.com/s/HkYEI2owPosXX8d5qpdp4g
本文介绍了这5种改善代码可读性的方法：
- 重用会多次使用的内容。
- 避免针对可读性和可维护性制定一个通行的解决方案。
- 尽可能减小模块、类或组件的大小。
- 为你的代码自动化执行一些规则和准则。
- 就算你的团队只有你一个人，也要像是在多人团队中一样编写便于协作的代码。
6、前端优秀实践不完全指南
https://juejin.cn/post/6932647134944886797
本文从页面展示、交互细节、可访问性三个大方面入手，罗列一些在实际的开发过程中，积攒的一些有益的经验。虽然不够全面，不过从一开始也就没想着大而全，主要是一些可能有用但是容易被忽视的点，也算是一个不错的查缺补漏小指南。
7、纯 CSS 也能实现拖拽效果？
https://mp.weixin.qq.com/s/gxe5QOVt9kRFWvXx-gugbg
页面元素的拖拽一般都是依赖js实现的，本文作者尝试用css在移动端页面实现元素的拖拽。
【基础夯实】
1、前端工程师所需要了解的WebView
https://mp.weixin.qq.com/s/PipKSnMQaTBhE5kSwG3DVQ
本文介绍了WebView的基本概念以及使用JSBridge来实现JS和Native通信的原理。
2、为什么cookie会有httponly属性?真实案例解释XSS的三种攻击
https://mp.weixin.qq.com/s/ag-OUsTyZiw3kCoSgONccg
常见的三种 XSS 攻击模式是存储型 XSS 攻击、反射型 XSS 攻击和基于 DOM 的 XSS 攻击，本文介绍了防范XSS攻击的三种策略。
3、Typescript也许应该这样入门才对
https://mp.weixin.qq.com/s/QK7HkDBeZ7U1hr3tvwwtyw
在本文中，主要探讨 TS 这门技术所解决的更本质的问题（即 JS 类型问题）及其解决方案（TS 只是其中一种）。希望读者看完这篇文章之后，能够超脱于 TS 本身，看到更加本质的问题，看到更多的解决方案。
对于 JavaScript 类型问题和解决方案，作者从个人认识出发，用脑图做了以下整理：
4、奇怪的知识——位掩码
https://mp.weixin.qq.com/s/zT4dZPYN3vYMRABWkH5SFQ
春节假期无聊刷手机时，偶然间看到了一篇关于“位掩码”的文章，本身就是奇怪知识的它可以用来解决一些奇怪的问题，实在是非常有趣。
5、Vue3丨进一步了解这 20 个响应式 API，写码如有神
https://mp.weixin.qq.com/s/u1o6dfFpZ3BsQxi1hVZSzg
在 Vue2 中，个人觉得对于数据的操作比较 “黑盒” 。而 Vue3 把响应式系统更显式地暴露出来，使得我们对数据的操作有了更多的灵活性。所以，对于 Vue3 的几个响应式的 API ，我们需要更加的理解掌握，才能在实战中运用自如，我们在编码会更加有自信，不会有那么多的疑惑。也会帮助我们更加理解框架的底层，如：proxy 怎么用的？Vue3 怎么追踪一个简单类型的？怎样去编码才能让我们系统更优。
6、Web开发应该知道的数据结构
https://mp.weixin.qq.com/s/9tV_8lh2Je-ZDP39UaLcuw
数据结构是指相互之间存在着一种或多种关系的数据元素的集合和该集合中数据元素之间的关系组成 。
常用的数据结构有：数组，栈，链表，队列，树，图，堆，散列表等，如图所示：
每一种数据结构都有着独特的数据存储方式，不同种类的数据结构适合不同种类的应用，部分数据结构甚至是为了解决特定问题而设计出来的，正确的数据结构选择可以提高算法的效率。
本文为大家介绍它们的结构和优缺点。了解数据结构并且在日常任务中使用它们非常重要，希望大家在本文的实现中找到一些乐趣，并尝试自己实现下。
7、一文搞懂Cookie、Storage、IndexedDB
https://mp.weixin.qq.com/s/F1gJD2ihZ8_aYkC1zved7g
随着前端技术的发展，存储变的越来越重要，就目前来看，浏览器主要支持三类存储：Cookie、Storage、IndexedDB，本文分别从定义、特点及使用等方面介绍了这三类存储方式。
【实用工具】
1、Github域名加上1s，在线VS Code阅读源码神器诞生
https://mp.weixin.qq.com/s/ZAkdo3xqcL2IHJhUanqebQ
近日，一款域名为 github1s 开源项目诞生了，正如它的名字所说，只要在 github 地址上面加上 1s，就能秒级用在线 VS Code 打开 github 项目，这可以说为开发者带来了巨大的便利。
2、5款好用且有代表性的GraphQL工具
https://mp.weixin.qq.com/s/VxeRwsYw0qL35BlPsDGbtg
本文介绍了几个与 GraphQL 有关的工具，它们能让你更方便地使用 GraphQL。
3、开工大吉，给各位大佬分享20款超级好用的chrome拓展插件
https://mp.weixin.qq.com/s/3nFWS1sx-yOu6aDYr9TcmA
本文主要从关于开发和生活小妙招两方面来推荐chrome的拓展插件。
【动态与研究关注】
1、TypeScript 4.2 正式发布：更智能的类型别名保留，声明缺失的帮助函数，还有许多破坏性更新
https://mp.weixin.qq.com/s/Dps5LCx5NClq5eB6Xf2jgw
让我们来看看 TypeScript 4.2 有哪些功能：
- 更智能的类型别名保留
- 元组类型中的前导 / 中间剩余元组
- 针对
in运算符的更严格的检查 --noPropertyAccessFromIndexSignatureabstract构造符号--explainFiles标记- 逻辑表达式中改进的未调用函数检查
- 解构变量可以显式标记为未使用
- 可选属性和字符串索引符号之间的宽松规则
- 声明缺失的帮助函数
- 破坏性更新
2、Vite 2.0 发布了
https://zhuanlan.zhihu.com/p/351147547
如果你还没听说过 Vite 到底是什么，可以到这里了解一下项目的设计初衷。如果你想要了解 Vite 跟其它一些类似的工具有什么区别，可以参考这里的对比。
Vite 2.0 其实是 Vite 的第一个稳定版本。2.0 带来了大量的改进：
- 多框架支持
- 全新插件机制和 API
- 基于 esbuild 的依赖预打包
- 更好的 CSS 支持
- 服务端渲染 (SSR) 支持
- 旧浏览器支持
3、2021再看Deno
https://mp.weixin.qq.com/s/h4DCr20ShsLP-t2ORCCdMg
deno是一个很好的创新，import-http，esm.run或模块转化服务，可以说都是deno探索间接或直接作用的结果。
但如果说想替代Node，目前的这些特性和性能提升，还不足以替代node。Node社区在node 4之后接纳es特性之后还是很与时俱进的，cjs和esm处理曾经也很及时。那么既然时机已成熟，今天node拥抱http import还会远吗？
4、React的未来：服务端组件
https://mp.weixin.qq.com/s/PNAdz7ryEn9oAxUu_NfPVw
React 团队正在试验一个新的想法，那就是将 React 组件区分为两个类型：客户端组件 和 服务端组件。
服务端组件，从某种意义上来说它是一个新型组件，该类型的组件会在服务端完成渲染后，再发送到客户端。本文介绍了服务端组件的特点以及和SSR的不同。
5、前端机器学习简史
https://mp.weixin.qq.com/s/kNBMlewGVo2DOPaqgPBCug
文中为大家介绍的算法工程框架 Pipcook，它是一款面向前端开发者的机器学习框架，我们希望它会成为前端开发者学习和实践机器学习的平台，从而推进前端智能化的进程。
【程序之外】
1、技术写作技巧分享：我是如何从写作小白成长为多平台优秀作者的？
https://juejin.cn/post/6932288843018141709
本文总结和分享了作者这一年从事技术写作的心得体会，对这一年进行了回顾，同时也希望给想往这方面发展的朋友提供一个参考。
从事技术写作的目的最好是学习和分享，写作内容可以是：
- 简单的学习笔记：因为是简单的记录别人的内容，效果可能不是很好
- 有自己理解的知识点解析：有自己见解，也有一定难度，但又不至于晦涩难懂，受众广，在社区容易受欢迎。
- 原理和源码解析：内容较难，受众略小，在社区不一定受欢迎，但是对于自己的成长非常有用。
从工作中总结：注意总结工作中有价值的技术内容，而不是做单纯的“API工程师”，在工作中完成技术沉淀，一举两得。
2、设计中的试验设计
https://mp.weixin.qq.com/s/sMs2xttZSpxd7ixjOl8DJQ
随着现代互联网的发展，试验的门槛不断降低，A/B测试已经被普遍运用在各行各业，就算你没有做过A/B测试，也很有可能参与过A/B测试，本篇文章详细介绍了什么是A/B测试以及怎么做A/B测试。
A/B测试就是将一群用户分组进行试验，然后观察不同组用户的数据表现。全流程大致可以分为3个步骤：定义阶段、试验阶段以及分析阶段。
3、程序员的“黄金时代”，死去又重来？
https://mp.weixin.qq.com/s/9fPSWFSx_9b9ScJP42cHLw
“我认为过去几十年的黄金时代已经过去了，那种当一名程序员就能找到工作的日子已经过去了。编程现在更像是会读书能写字。你必须具备这样的能力。”
——硅谷技术布道者 Tim O’Reilly
4、UX设计中的游戏化：为产品添加有趣的体验
https://mp.weixin.qq.com/s/a04AsH0zmvz6mtAX4CT16A
游戏化能够激发用户的情感，是近年来最受欢迎的UX设计趋势之一，本文介绍了五种提升App体验的游戏机制。
若有收获，就点个赞吧
0 人点赞
