栏目主编：平侠
The Developer Experience Gap
https://redmonk.com/sogrady/2020/10/06/developer-experience-gap/
If there is and can be no Apple-equivalent enterprise vendor arriving to make sure the enterprise telephone app team plays nicely with the enterprise music player team, what progress can be expected? It’s early, and the next few quarters should provide hints at who has accurately identified the depth of the problem and taken steps to address it. In the meantime, here are five adjectives that will describe the next generation of developer experience: Comprehensive, Developer Native, Elegant, Multi-Runtime, Multi-Vendor.
Faster Web App Delivery with PRPL
https://addyosmani.com/blog/the-prpl-pattern/
PRPL is a pattern for structuring and serving web applications and Progressive Web Apps (PWAs) with an emphasis on improved app delivery and launch performance. The letters describe a set of ordered steps for fast, reliable, efficient loading.
Webpack 5 release
https://webpack.js.org/blog/2020-10-10-webpack-5-release/
The major version was also the chance to revise some of the defaults and to align with proposals and specifications that come up in the meantime. Relaeted: Webpack 5 Headache, How to Set Up webpack 5 from Scratch.
Temporal: Open Source Workflows as Code
https://mikhail.io/2020/10/temporal-open-source-workflows-as-code/
Microservices, serverless functions, cloud-native applications—distributed event-driven business applications are hot, and we will deal with them for years. I worry that the application development industry underestimates the complexity of such systems. Ad-hoc solutions to common problems may rapidly increase the technical debt and slow down the ability to innovate. I’m excited to see tools like Temporal enter the space of open-source workflows, or rather the space of asynchronous data processing. Releated: Why the Serverless Revolution Has Stalled, Serverless Horror Stories.
Emerging Architectures for Modern Data Infrastructure
https://a16z.com/2020/10/15/the-emerging-architectures-for-modern-data-infrastructure/
And yet, despite all of this energy and momentum, we’ve found that there is still a tremendous amount of confusion around what technologies are on the leading end of this trend and how they are used in practice. In the last two years, we talked to hundreds of founders, corporate data leaders, and other experts – including interviewing 20+ practitioners on their current data stacks – in an attempt to codify emerging best practices and draw up a common vocabulary around data infrastructure. This post will begin to share the results of that work and showcase technologists pushing the industry forward.
栏目主编：侑夕、紫益
????一周精读????《设计模式 - Factory Method 工厂方法》
https://github.com/dt-fe/weekly/169.精读《设计模式 - Factory Method 工厂方法》.md
通过三个生动的例子与 JS 示例代码，帮助前端的你理解设计模式，让我们一起积累不过时的知识！
Factory Method（工厂方法）属于创建型模式，利用工厂方法创建对象实例而不是直接用 New 关键字实例化。意图：定义一个用于创建对象的接口，让子类决定实例化哪一个类。Factory Method 使一个类的实例化延迟到其子类。
ECMAScript 2020 新增特性
https://juejin.im/post/6883306672064987149
ECMAScript 2020 是 ECMAScript 语言规范的第 11 版，新增的这 9 个新特性值得一学。
Serverless 未来十年发展解读
https://juejin.im/post/6883773727733972999
本文整理自 Johann Schleier-Smith 在 ServerlessDays China 的演讲，主要分为四个部分：首先阐述 UC Berkeley 怎样来定义 Serverless ，之后会分享一些近期的研究成果和进展，最后提出对云计算未来的一些预测和设想。
浏览器是如何工作的
https://king-hcj.github.io/2020/10/05/google-v8/
一篇文章方方面面的介绍到了 Chrome V8，让你更懂 JavaScript，很是详细。
超全的 Linux Shell 文本处理工具集锦
https://segmentfault.com/a/1190000037480939
每周学一点新知识，用过 Shell 处理一些文本才知道原来这么简单方便，此文将一些处理文本常见的工具都介绍了一个遍，可先了解到用的时候再查。
一文了解文件上传全过程
https://segmentfault.com/a/1190000037411957
一篇很详细的介绍文件上传流程的好文，从前置知识、请求端、服务端、接收端一层一层来带着入学的感觉。
栏目主编：侑夕
Zipson - Json 压缩工具
https://github.com/jgranstrom/zipson
Zipson 是一个让原本JSON.parse/stringify增加了压缩和流媒体支持的临时替代方案，感觉前后端传输中，接口先压缩吐出数据，前端通过解压获取 Json，可让传输数据变小 50%。
Bubble Tea：一个强大轻量的 TUI 框架
https://github.com/charmbracelet/bubbletea
Bubble Tea 一个基于 Elm 架构的 Go 框架，借此可用有趣、函数式、带状态的方式去编写命令行 APP，效果很不错，虽然是 GO 语言，不过可触类旁通研究一波。
BlurHash: 图片懒加载舒服的占位符
https://github.com/woltapp/blurhash
之前我们一般使用纯灰色亦或是骨架占位符的方式来缓存暂未出来的图片，虽然看起来没问题但是不讨设计喜欢，BlurHash 这个模糊彩色的占位符值得试试。
Drogon：一个基于 C++14/17 的 Http 应用框架
https://github.com/an-tao/drogon
Drogon 是一个基于 C14/17 的 Http 应用框架，通可以方便的使用 C构建各种类型的 Web 应用服务端程序，写习惯 Node 的同学看看这个会让你惊讶的。
detect-gpu:一个 GPU 的检测库
https://github.com/TimvanScherpenzeel/detect-gpu
根据 GPU 的 3D 渲染基准分数对 GPU 进行分类，开发人员可借此结果为图形密集型应用程序提供合理的默认设置。
Plausible Analytics：Google Analytics 替代品
https://github.com/plausible/analytics
Plausible Analytics 是一个简单、轻量且隐私友好的 Google Analytics 替代品，不使用 cookie，自托管或者云上部署都可以。
Awesome YouTubers
https://github.com/JoseDeFreitas/awesome-youtubers
以上这个 Awesome YouTubers 将技术领域值得关注的 YouTuber 给挑选出来了，适合那种看视频学习的同学来有选择关注~
栏目主编：大漠
[mediaqueries-5] Updating the CSS media feature syntax for foldable & dual-screen devices #5621
https://github.com/w3c/csswg-drafts/issues/5621
@zouhir 和他的同事@dlibby是最早提出了跨媒体特性，主要用来解决微软双屏幕设备，然后拓展到可折叠屏幕，甚至是可以通过创建更多枚举值来表示新硬件的屏幕拓扑。这是目前解决双屏幕和可折叠屏幕的技术方案之一。现在该特性已提交W3C规范中 Media Queries Level 5进行讨论。
The --var: ; hack to toggle multiple values with one custom property
https://lea.verou.me/2020/10/the-var-space-hack-to-toggle-multiple-values-with-one-custom-property
你肯定知道使用JavaScript来动态更新或者应用CSS的属性值，但你肯定不知道如何在CSS中采用自定义属性的特性来决定属性运用哪一个值。时至今日的CSS自定义属性也可以做到JavaScript中真（ true ）和假（ false ）的切换。
Logical layout enhancements with flow-relative shorthands
https://web.dev/logical-property-shorthands/
很多开发者都习惯于物理属性，但在Web的布局当中物理属性将会带来很多令人感到困惑，甚至是麻烦。特别是有着国际业务需求的同学，那么CSS逻辑属性的到来，将会改变这一切，再也不会让你为不同语言排版，布局感到头痛。而且CSS逻辑属性真的要到来了，甚至说已经到来了。
Dynamic Element Scaling in CSS
https://levelup.gitconnected.com/dynamic-element-scaling-in-css-7e35ed9a3914
使用CSS给HTML元素做动态缩放，比如 width 、 height 或者 font-size ，可能会想到的是使用CSS媒体查询特性，在不同的屏幕下使用不同的值。但这将会增加代码的冗余度，也会让你的代码变得越来越难维护。在这篇文章中，作者通过CSS的 calc() 函数，向大家展示了如何动态修改元素大小。
一个Div的能做什么：Demo1
https://codepen.io/jshwrnr/full/ZEOGroR
这是一个 div 构建的纹理背景效果。
栏目主编：彼洋
TC39 9月会议提案进度报告
https://www.yuque.com/alibabaf2e/vab8a9/czwuqv
本次会议上，我们主持了 Error Cause 提案进入了 Stage 1，作为阿里巴巴集团内 JavaScript 错误处理模式的一个总结，将这个行为写入标准，便于更多的开发者工具如 Alinode、阿里云 ARMS 等改进异常分析的体验。
Chrome 86 重要更新
https://www.yuque.com/alibabaf2e/gt3np7/ullslm
Chrome 86 在2020年10月推出了稳定版，现已全面应用于Android、Chrome OS、Linux、macOS 和 Windows等平台，我们一起来看下这次的重要更新。
栏目主编：十吾
为什么智能手机会导致颈部综合症可视化
https://multimedia.scmp.com/lifestyle/article/2183329/text-neck/index.html
现在，全球手机用户数量超过了 50 亿，这个世界上三分之二的人口都拥有手机。我们大多数人每天至少要弯腰 2 个小时，这将让我们的颈部承受的重量增加多达 27 千克。如果在走路时使用手机发消息，则可能会带来各种意外事故。该可视化作品通过交互的形式，展示了颈部是如何承受压力的。
名作失窃可视化
https://www.informationisbeautifulawards.com/showcase/3266-you-could-fill-a-museum
联邦调查局的数据库全球数据库包含7,200多种失窃的名作，包括斯特拉迪瓦里小提琴、卡尔德手机、蒂法尼灯、小丑画等。
对 tensorflow 中数据流图的可视分析
Tensorflow 是谷歌开发的当下最流行的机器学习软件之一。它采用数据流图（Dataflow Graph）来表达机器学习算法的计算过程，用户可以定制不同的数据流图来构建自己的算法。然而，随着深度学习的兴起与流行，各类神经网络渐趋大规模、复杂化，算法开发者仅凭借自身的理解与记忆，很难把握算法的各部分体系结构，相互之间也难以进行沟通。为此，这篇文章提出了可视化工具 TensorFlow Graph Visualizer，通过可视分析帮助用户在 TensorFlow 中进行算法分析与开发。该文章荣获了 IEEE VAST 2017 的最佳论文奖。
栏目主编：平侠、侑夕
Thoughts writing a Google App script
https://martinfowler.com/articles/202009-google-app-dir.html
Recently a friend of mine asked for a simple program that would correlate some data drawn from a couple of online services. I decided the best way to do this for him would be to use a google spreadsheet as the host, putting the code into the spreadsheet's script area. I'm no expert in Google App Script, but the exercise led to a few observations, which I feel compelled to share.
How AI is powering a more helpful Google
https://blog.google/products/search/search-on/
When I first came across the web as a computer scientist in the mid-90s, I was struck by the sheer volume of information online, in contrast with how hard it was to find what you were looking for. With recent advancements in AI, we’re making bigger leaps forward in improvements to Google than we’ve seen over the last decade, so it’s even easier for you to find just what you’re looking for. Today during our Search On livestream, we shared how we're bringing the most advanced AI into our products to further our mission to organize the world’s information and make it universally accessible and useful.
Help kids Be Internet Awesome
https://beinternetawesome.withgoogle.com/en_us/interland
To make the most of the Internet, kids need to be prepared to make smart decisions. Be Internet Awesome teaches kids the fundamentals of digital citizenship and safety so they can explore the online world with confidence.
编码技巧（五）：适当可扩展
https://zhuanlan.zhihu.com/p/266076082
本文介绍了一个新的编码技巧：“适当可扩展”，什么样的代码才能成为 “适当” 的呢？文中详细的进行了解释。值得一提，代码的各种优秀特征，都是需要花费精力来写出来的，也就说需要成本，我们才能有收益。所以，提供 “可扩展性”，必然得是满足了相关的需求，不能是开发者一厢情愿而为之。当然为了追求技术精进，高度可扩展的案例，也是非常值得学习的。这并不冲突。我们可以身怀绝技，但用的时候却只 “恰到好处”。这才是行家的手笔呀。
企业文化建设需要适度“用力过猛”
https://mp.weixin.qq.com/s/fTqMP7vbunhWyDOleyYgvw
企业文化建设，是一个有破有立的过程，破在固有的思想观念和行为模式，立在新的思想观念和行为标准。按照惯性定律，没有外力作用时，事物总是处于匀速运动或静止状态，因此成功的企业文化建设，多少会给人一种“用力过猛”的感觉，否则不足以打破当下的惯性；即便是自我心灵觉醒，同样也需要外力。海尔砸冰箱，就是一种适度“用力过猛”的外力，张瑞敏砸的不是冰箱，砸的是当时*员工队伍中落后的思想观念，不光在企业内部，甚至在整个企业界唤醒了人们沉睡的质量意识。适度“用力过猛”，为的是让人从习以为常的稳态中惊醒，迈向需要做功的激活态（非稳态）。
当百度to B
https://mp.weixin.qq.com/s/xS5ACCrgh0C5w_rUL2gwJg
当云计算进入以各行业传统企业和*部门为主力客户的“下半场”，一个行业共识是，计算与存储的基本能力之外，云与AI的结合将成为接下来的关键竞争点——云计算负责新型IT基础架构，AI负责具体业务问题。而在云和AI两个领域，尤其是二者的结合上，百度都是重要的玩家。
iOS 后台锁屏监听摇一摇
https://juejin.im/post/6881420727371694093
不会吧这也行系列，一般情况下出于省电、权限、合理性等因素考虑一些奇怪的需求 iOS 不是很好实现，如当 APP 处于后台或锁屏状态时，依旧可以监听到摇一摇，看看这里是怎么做的。
Flutter 1.22 正式发布
https://juejin.im/post/6879048672597213198
来看一看 Flutter 1.22 趁着 iOS 14/Android 11 发布季，都更新了一些什么样的功能？
1 分钟将 vscode 撸成小霸王
https://juejin.im/post/6882576431503638536
这个是真的“浪”，借助JSNES模拟器弄了一个 VSCode 的小霸王游戏机，VScode 插件搜索「小霸王」即可使用，这个想法很是不错~
哪些工具使你成为一个更好的程序员？
https://news.ycombinator.com/item?id=23468193
Hacker News 上面比较热烈的一个讨论，看看国外的程序员怎么说？
很炫酷的 3D 可视化的星空
http://stars.chromeexperiments.com/
一个可交互式的三维可视化恒星邻居，包括超过 10 万颗附近的恒星，点击 URL 进入很是不错。
Blush:插图定制生成工具
这个工具不错的是可以自定义插图的每一部分来创建自己的构图，同时种类也很多，对于前端同学写一些图文搭配 PPT 蛮适合。
2020 中国奢侈品消费者数字行为洞察报告
https://mp.weixin.qq.com/s/fsBblPTiTjYXg1vUKzK_Jw
从此文来了解下后疫情时代中国奢侈品消费市场呈现的趋势、消费链路以及品牌打法，还可结合“名媛拼团”侧面来剖析下。
关注「Alibaba F2E」
把握阿里巴巴前端新动向