第05期 - 泸沽湖
封面图摄于今年国庆在泸沽湖坐船到亲爱的客栈途中，第一次见如何清澈透蓝的湖水，到丽江一定需要抽空去一下泸沽湖看看
记录每周看到的前端潮流技术，筛选后用接地气方式发布于此，关注此专栏可以及时收到更新~
好文和学习
新潮流？用其他语言来写 JS 工具
https://2ality.com/2020/10/js-plus-other-languages.html
最近发现不少比较快的 JS 周边工具都是用 Go 或者 Rust 来实现的，同时速度远快于之前用 Node 来实现，比如说比 Webpack 快百倍的 esbuild 使用 Go 来实现的，或许是一种新的潮流
用 TensorFlow.js 来让蒙娜丽莎栩栩如生起来
https://blog.tensorflow.org/2020/09/bringing-mona-lisa-effect-to-life-tensorflow-js.html
深度好文，这个项目利用 TensorFlow.js、深度学习和图像处理技术，让蒙娜丽莎的眼神和头跟踪实验者的动作来移动
只用 CSS 来实现设置数字计数器动画
https://css-tricks.com/animating-number-counters/
要写一个数字从 0-100 增长的动画效果，可能首先会想到用 setInterval，但是其实你可以试试 New School 的 CSS 解决方案
去复习一遍 Linux 的知识
https://juejin.im/post/6881755746216706062
标题是「对不起，学会这些 Linux 知识后，我有点飘」有些 2，不过用前端久了，去复习一下 Linux 用法是很不错的
改变世界的一次代码提交
https://hutusi.com/articles/the-greatest-git-commit
本文主要是讲当时 Linus 是怎么设计出来 Git 的第一个版本来的，从背景、设计、实现、启示来阐述，对于了解 Git 原理很不错
开源和工具
SWC- 超快 TS / JS 编译器
https://github.com/swc-project/swc
SWC 是一个用 rust 编写的超快速 typescript/javascript 编译器，类似用 Rust 写的 JS 工具还有 RSLint格式校验工具和Volta项目命令行 node/npm/yarn 版本管理工具，还有用 Go 实现的Elsa
jspm - 可直接使用的 NPM 包模块 CDN
https://jspm.org/
jspm 提供了一个模块 CDN，允许 npm 中的任何包作为原生 JavaScript 模块直接加载到浏览器或 Node 环境中使用，类似的还有Skypack，可以和 Webpack5 中的模块联邦结合起来看
Jazzit - 让你的脚本运行成功失败播放声音
https://github.com/Sangarshanan/jazzit
Python 的一个库，挺有新易，有兴趣的同学可以用 Node 去实现一个
Headless Recorder Chrome 扩展
https://github.com/checkly/headless-recorder
Headless recorder 是一个可以记录浏览器事件交互行为并生成 Puppeteer 或 Playwright 脚本的 Chrome 扩展工具，在测试领域可以好好玩一玩
Airbnb 开源的可视化组件 Visx
https://github.com/airbnb/visx
Visx 是可复用的低代码可视化组件集，将 D3 的强大功能与 React 虚拟 DOM 更新的优势结合起来，很有 Airbnb 的视觉特色(效果>>)，做一些年轻化潮流的可视化场景可以试试
PASUKON-简单的 JAVASCRIPT 解析器生成器
https://pasukon.rocks/
Pasukon 使用易于学习的语法生成解析器，基于解析器组合器，还实现了词法分析步骤，可以通过如上在线页面来试试看
iOS 和多端
深入浅出主流的几款小程序跨端框架原理
https://juejin.im/post/6881597846307635214
作者从目前市场上主流的小程序跨端框架，类 Vue、类 React 的原理分析了一个遍，长文非常适合一读
Flutter 渲染引擎详解 - iOS Metal 篇
https://zhuanlan.zhihu.com/p/214099612
Flutter 渲染引擎在 iOS 上支持三种渲染方式，分别是纯软件（CPU），Metal 和 GL，此文主要讲在 iOS 上 Metal 的一个原理
Flutter Widget 体系架构与 UI 渲染流程
https://juejin.im/post/6874737011325059086
本文为 Flutter 技术底层原理基础，了解后有便于对于其状态管理、Navigator 页面导航、Key 的设计原理、FPS 等领域扩充研究
灵感和设计
硬核 UP 自制带屏幕的 NFC 名片
https://www.bilibili.com/video/BV1Cf4y1y7KT/
B 站一 UP 开源了一个自己实现的超迷你智能 NFC 卡片，带电子墨水屏，可以模拟各种 IC 卡，和配套 APP 使用设置显示内容等等功能，非常佩服这个全能的人才
用 JS 来玩音乐
https://bongo.cat/
试试按一下 1 1 3 1 6 5，然后按一下 1 1 3 1 8 6，会有惊喜，更多谱子可见Externalizable/bongo.cat，很多“闲人”，玩完以后这个 JS 音乐生成库ZzFXM也可以了解一下~
Codepen-用 CSS 来画一个 Switch
https://codepen.io/cybercountess/pen/PoNXEqL
可能你画就是一个 img 标签解决啦~
如何保持长时间专注？
https://www.yuque.com/deerain/wqpb2o/nwazye
本文主要针对的是无法长时间保持注意力的人，普通人能一次性保持高度专注的时长一般是 3040 分钟,如果低于这个时间，那就阔以看看此文啦
为什么自己照镜子感觉自己长的蛮好看，可是一拍照就觉得不咋的?
https://www.zhihu.com/question/34368524
知乎上面的一个问答，可能大部分同学都有这个疑问，为啥“我”镜子里面这么好看，拍照出来感觉差了点儿~