第08期 - 日本大阪海游馆

封面图日本大阪海游馆,拥有超极大鲸鲨而著名,海洋生物种类比想象多很多,等明年国外疫情结束,假如到大阪旅游除去环球影城最推荐这个

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

好文和学习

我的前端成长之路:内观自在,外观世音,追寻内心平静
https://mp.weixin.qq.com/s/yjAzgpBpLUrAKgIZd__sNg
来自飞猪前端圣司的一篇关于自我成长的总结文章,校招毕业 4 年时间从 P5 到 P8,内观自在,外观世音,推荐前端同学一读

对开发人员有用的定律、理论、原则和模式
https://github.com/nusr/hacker-laws-zh
值得收藏和多次阅读的程序员定律,里面收集很多抽象经验的解释,比如说「过早优化是万恶之源」、「九个女人不能在一个月内生一个孩子 」

解释 JavaScript 的内存管理
https://felixgerschau.com/javascript-memory-management
我们平时写代码的时候几乎不太考虑 JS 的内存管理,因为浏览器已经帮忙做了,但是有时候假如碰到内存泄露,那懂一些原理会有便于你排查问题

聊一聊二维码扫描登录原理
https://juejin.im/post/6844904111398191117
可先想后看,假如让你实现一个二维码扫码登录的功能你会怎么做?

为什么 IPv6 难以取代 IPv4
https://draveness.me/whys-the-design-ipv6-replacing-ipv4/
西电学弟的文章,从网络原理角度来解释为什么 IPv6 难以取代 IPv4,整体博客质量超级高,值得关注

使用 Emoji 来创建 CSS Shapes
https://css-tricks.com/creating-css-shapes-with-emoji/
思路还不错,文章通过不少 Demo 来讲述将 Emoji 图标的形状样子内联到文字环绕的效果

开源和工具

Gazepass - 无密码的登录 API
https://gazepass.com/
上周周刊中《Meet Face ID and Touch ID for the Web》,刚想去折腾一下,就有人给产品化出来了,效果实现很赞,说不定不久将来在 Web 中输入框密码类型就变成可选状态了

RSSHub - 万物皆可 RSS
https://github.com/DIYgod/RSSHub
对于有 RSS 阅读习惯的同学不要错过这个工具,一个很简单易用、易于扩展的 RSS 生成器,借此可以给平时不支持 RSS 的内容网站生成 RSS 订阅源

iOS 上的 Linux Shell 工具
https://github.com/ish-app/ish/
iOS 上的命令行工具,想想可以用它来玩什么?

使用 TensorFlow.js 进行 NSFW 检测
https://github.com/infinitered/nsfwjs
NSFW 指 Not Safe For Work ,这个库叫 nsfwjs,通过 TensorFlow.js 在浏览器快速识别有点点那个啥的图像,别多想,还是去看看如何实现的~

Eta - 又来了一个新的模版引擎
https://eta.js.org/
其实 tpl 挺好用的,就是感觉有些上古时代的产物了,Eta 相比就潮流一些了,可以同时在 Node、Deno 和浏览器中使用,性能好、轻量、配置性更强一些

使用 GitHub Actions 等生成你的跑步主页
https://github.com/yihong0618/running_page
思路很不错,借助 GitHub Actions、Gatsby、Vercel 自动部署、Mapbox 地图等能力可以将你的平时的跑步记录(Keep、Nike、Garmin 等)生成一个自动更新的个人跑步主页

iOS 和多端

Native 地图与 Web 融合技术的应用与实践
https://mp.weixin.qq.com/s/RKGJOtRMjTetTZRIGzqH_Q
同层渲染是移动端 H5 中近年的一种性能体验“黑科技”优化技术,也即将 WebView 与 Native 组件叠加到一起共处一个页面,如打车的地图用 Native 的,操作部分用 H5 来实现,美团的解决方案可供输入

自研 iOS 热更新机制——OCPack 技术方案总结
https://juejin.im/post/6884833291740905480
讲了一个 iOS 客户端动态化技术方案,不过更多是看看思路以及热更新实现的一些原理,这东西由于 iOS 审核的原因比较难大规模使用

iOS 性能优化实践:头条抖音如何实现 OOM 崩溃率下降 50%+
https://mp.weixin.qq.com/s/4-4M9E8NziAgshlwB7Sc6g
OOM (Out Of Memory)指的是在 iOS 设备上当前应用因为内存占用过高而被操作系统强制终止,在用户侧的感知就是 App 一瞬间的闪退,Crash 对于客户端同学很好理解但是对于前端却很头疼,来看看头条的解决思路是怎么样的?

如何进行 iOS Widget 开发?
https://mp.weixin.qq.com/s/xXEWWHXt4oKDSboogTbTZA
盒马同学基于盒马小镇的 Widget 开发,分享在登录授权、数据更新、界面渲染以及审核上的实践经验

灵感和有趣

产品经理如何做产品架构设计
http://www.woshipm.com/pd/4231285.html
对于产品经理来说,发展到一定阶段后,日常的工作内容往往离不开产品架构设计。这是一个极其细致的活,需要产品经理有很强的架构能力。那么产品经理如何才能摸清产品的底层逻辑、提升对产品的认知,做好产品架构呢?

到底几点睡觉才算是不叫熬夜?
https://daily.zhihu.com/story/9729486
最好还是别熬夜,不如今天就早点睡吧

人口普查究竟查什么?
https://mp.weixin.qq.com/s/Hc6TR83XRpwxW_g3vIdZXw
回形针近期的一篇科普文,在中国人口普查是如何进行的?前几次的普查究竟查到了什么?

如何有效地进行代码 Review?
https://mp.weixin.qq.com/s/uFivYfX53s5zAe6hacznlg
腾讯技术同学关于为什么要做以及如何高效做 Code Review 的一篇文章

一个纯 CSS 游戏 - You Must Build a Lighthouse.
https://codepen.io/ivorjetski/pen/OJXbvdL
游戏动效做的很不错,可以重点学习作者一些效果是如何借助 CSS 实现的