蒲公英 · JELLY技术周刊 Vol.36: 你好 Hooks，再见 2020

蒲公英 · JELLY技术周刊 Vol.36

不知不觉，蒲公英已经伴随我们走过了一年时光，在这一年我们从基础技术、前端框架、图形编程、人工智能等诸多领域为大家推介了三百余篇文章，尽管这一年来风雨不断，但是技术演进的方向却并不会停歇，在和 2020 挥别之前，可不要忘记本期的内容推荐哦～

登高远眺

天高地迥，觉宇宙之无穷

基础技术

文本长度不一如何影响界面布局

使用 CSS 构建布局时，如何做好短文本内容与长文本内容的兼容，是每位优秀前端工程师的基本修养，当清楚地知道文本长度变化是否会影响界面布局时，可以避免很多不必要的问题。

前端框架

使用 Hooks 的五个常见错误（2020 版本）

在 React 支持使用 Hooks 编写组件后，越来越多的同学已完全投入 Hooks 的怀抱，本文总结了五个常见错误，大家可以看看自己是否也遇到过，查漏补缺。

图形编程

手把手教你做游戏，金币小镇 EVA 全解

EVA 互动技术体系为手淘在互动游戏前端开发的一整套技术解决方案，包含了资源管理方案、IDE 方案以及技术选型方案，并针对金币小镇这款游戏进行了详细的落地说明，为营销互动开发提效提供了一些思路。

工程化

淘宝小程序还可以这么玩？私域互动实战指北！

超级 APP 中的小程序创意互动能怎么开发，本文给出了答案。通过 200+ 个品牌定制创意互动的落地，验证了这一整套技术方案的可行性，从技术设计，到生产链路的打通，再到多端协调达到性能最优化等等的推进，展示了如何基于业务进行架构设计的强大专业力。

丁香园的前端研发效能讲义

无论对于前端还是后端，都涉及到各种复杂程度不一的研发工作流，对于研发效能提升的思考和探索，从未停止过。往往需求从开发到上线，均会经历准备、开发、测试验收和发布 4 个阶段，每个阶段又涉及到各种环节，导致研发流程冗长且容易出错。一个好的工程化平台，能够串联起研发过程中的各个环节，让开发人员更加聚焦于业务开发，而不是疲于应对工具带来的问题，最终达到降本增效的目的。

设计哲学

基于 C4 模式绘制软件架构图

随着敏捷开发的流行，很多团队停止或缩减了他们的图表和文档工作，包括使用UML。即使有团队在使用软件架构图，也往往也混淆不清。为此，2013 IEEE 先驱奖获得者 Simon Brown 提出了 C4 Model。C4 Model 由一系列分层的软件架构图组成，这些架构图用于描述上下文、容器、组件和代码，C4 图的层次结构提供了不同的抽象级别，每种抽象级别针对不同的受众。如果你还在苦恼架构图规范和统一，也许你应该尝试了解一下。

沧海拾遗

沧海拾遗，积跬步以至千里

CSS3 动效优化: 从浏览器层面解析原理

切图仔，真的懂自己的代码为什么要这么写么？能够知道怎么做才是性能最佳，同时还能理解其原理？如果不懂，那还不快来看看这篇文章，从根本上解释清楚了为什么我们要这么写！

Animation 动画: 那些你不曾知晓的技巧与细节

实现动画效果往往有很多方案，实际开发中我们往往根据需要来选择最适合的最优解。这篇文章详细讲解了动画开发中常用的各种属性、效果以及可能遇到的问题，梳理了各类实践下的技巧和细节，快来看看，为自己的知识体系查漏补缺吧～

「蒲公英」期刊，每周更新，我们专注于挖掘「基础技术、工程化、跨端框架技术、图形编程、服务端开发、桌面开发、人工智能、设计哲学、前端框架」等多个大方向的业界热点，并加以专业的解读；不仅如此，我们还会推介精选凹凸技术文章，向大家呈现团队内的研究技术方向。

抬头仰望，蒲公英的种子会生根发芽，如夏花绚烂；格物致知，我们登高远眺、沧海拾遗，以求积硅步而至千里。

蒲公英 · JELLY技术周刊贡献指南

欢迎关注凹凸实验室博客：aotu.io

或者关注凹凸实验室公众号（AOTULabs），不定时推送文章。