# 第 13 期 - 茶颜悦色

> 封面图摄于 18 年喝到的第一杯茶颜悦色，很是好喝，没去过长沙的同学值得一去

- Issue: 13
- 发布日期: 2021/02/16
- HTML: https://weekly.tw93.fun/posts/13
- JSON: https://weekly.tw93.fun/api/posts/13.json
- English translation: https://weekly.tw93.fun/en/posts/13.md

---

<img src="https://gw.alipayobjects.com/zos/k/st/6nkLEu.jpg" width="800" />

<small>封面图摄于 18 年喝到的第一杯茶颜悦色，很是好喝，没去过长沙的同学值得一去</small>

> **记录每周看到的前端潮流技术，筛选后用接地气方式发布于此，关注此专栏可以及时收到更新~**

## 好文和学习

**把世界上第一个 JS 引擎编译回了 JS**  
<https://juejin.cn/post/6902339728977166344>  
今年是 JS 正式发布 25 周年，作者找到了当时第一份 JS 引擎代码将其移植成 WASM 版本，最后可简单跑起来，思路不错。

**2020 年 CSS 现状报告**  
<https://2020.stateofcss.com/zh-Hans/demographics/>  
CSS 在 2020 年使用现状偏国外的一个统计，可以借此理解 CSS 的开发者现状、特性使用现状、单位、选择器、周边工具等情况。

**来自 JS13K 2020 竞赛的十大游戏**  
<https://github.blog/2020-10-11-top-ten-games-from-the-js13k-2020-competition/>  
这个比赛需要开发者在一个月的时间内用不到 13KB 的 JS 实现一个网页游戏，来看看排名前十的都有哪一些。

**淘宝小程序私域互动实践总结**  
<https://mp.weixin.qq.com/s/yfS-gx_GJrIfasK47uNS_w>  
千之兄从一个较为全面的视角对淘宝小程序创意互动项目进行梳理和阶段性小结，介绍其相关原理、能力、应用、现状与未来。

**如何搭建一套 “无痕埋点” 体系？**  
<https://mp.weixin.qq.com/s/nJZk-0WtEW6C8mTeJCSUzQ>  
前端必备知识点，看看其他公司是怎么做的。

## 工具和开源

**Rectangle：Mac 上的一个好用的窗口管理工具**  
<https://github.com/rxhanson/Rectangle>  
用了比较久的一个窗口工具，通过快捷键的方式将你的 Mac 应用窗口放置到上/下/左/右/居中/最大，以及窗口移动到显示器，很是不错。

**Element UI for Vue 3.0 来了**  
<https://github.com/element-plus/element-plus>  
Element3 没有在原有 Element2 上面进行修修补补，直接使用 TypeScript + Composition API 重构的全新项目。

**WMR：面向现代 web 应用的小型一体化开发工具**  
<https://github.com/preactjs/wmr>  
比较新颖的一种方式，在一个 2M 的没有依赖的单文件将所有事情给做了，很开箱即用。

**react-dev-inspector：点击页面元素在编辑器打开对应代码**  
<https://github.com/zthxxx/react-dev-inspector>  
详细介绍文档可见 [我点了页面上的元素，VSCode 乖乖打开了对应的组件？原理揭秘](https://juejin.cn/post/6901466406823575560)，对于大型项目的开发维护，这样的调试神器还挺不错。

**U^2-Net：快速将人的照片变成铅笔画**  
<https://github.com/NathanUA/U-2-Net>  
有一个不成熟的想法，找一个景区，开一个画人像的店，先拍照，间隔 3 小时来取的那种..
<img src="https://gw.alipayobjects.com/zos/k/ns/otysba.jpg" width="800" />

## iOS 和跨端

**iOS AOP 方案的对比与思考**  
<https://mp.weixin.qq.com/s/5JhbX4McMifFpZ7NyztIQw>  
AOP 可以理解成面向切面编程，是可以通过预编译的方式和运行期动态实现，在不修改源代码的情况下，给程序动态统一添加功能的技术，借此此文来学习一下。

**一篇吃透 Dark Mode 搞定“暗黑/深色”适配**  
<https://mp.weixin.qq.com/s/02QmgMkmVcB8x7xVZJT_Bg>  
今年开始 Android、iOS 纷纷支持暗黑模式，此文更多是介绍如何来做以及需要注意什么。

**UME - 丰富的 Flutter 调试工具**  
<https://mp.weixin.qq.com/s/9GjXB9Eu-OP3fIjdQWKklg>  
字节跳动开源的一个 Flutter 调试工具包，放置到 App 测试包内显示设计 UI、网络、监控、性能、logger 等信息。

## 灵感和有趣

**为什么关于香菜的评价这么两极？**  
<https://daily.zhihu.com/story/9730666>  
原来爱不爱吃香菜还和基因有关系，值得一看。

**JS 在 25 年前刚诞生的时候科技圈是怎么评价的**  
<https://superhighway.dev/javascript-25-years-1995>  
感觉不久，但是又感觉很久的样子。

**各个大厂 APP，是如何保护打工人的隐私信息？**  
<https://www.ui.cn/detail/568212.html>  
文章是从产品设计视角来写的，我们可以从小白用户角度来看为什么要这么设计。