终端技术篇
推荐语:今年淘宝在终端技术上做了三个很重要的探索:一、前端和移动端在技术上开始融合，例如技术架 构、工具体系的设计上都进行了贯通设计。二、基于Web的研发模式+增强的跨平台容器/引擎+原子化能力的Native原生架构，使前端和移动端在业务迭代上具备同等交付能力，提升效率。三、前端技术深入到业务领域，打破过去局限于技术本身(多样性和深入度)的探索上，使技术能够真正给业务带来价值。期待 这些尝试能够为终端领域带来新的变化。
—— 阿里巴巴资深技术专家 舒文
推荐语:过去的一年里，淘宝用户时长及浏览深度增长对性能体验的诉求愈发强烈，业务加速创新对交付效 率的要求提升，对既有有研发模式的挑战更大，都推动了淘宝终端技术体系不断演进。本篇重点分享在用户体验改善、研发效能破障、架构体系演进等方面的背后思考与创新实践，希望为大家带来一定启发与帮助。
—— 阿里巴巴资深技术专家 弘禹
内存优化: 纹理压缩技术
作者：楚奕
出品：大淘宝技术
相比普通格式图片，纹理压缩可以节省大量显存和 CPU 解码时间，且对 GPU 友好。
背景
游戏开发中纹理是内存占用大户，移动设备因为内存有限，问题更加明显。据统计，淘宝互动小程序性能卡口 70% 以上都是因为内存超标，而内存超标的主要原因则是图片素材过多、过大等。
我们知道传统的图片文件格式有 PNG 、 JPEG 等，这种类型的图片格式无法直接被 GPU 读取，需要先经过 CPU 解码后再上传到 GPU 使用，解码后的数据以 RGB(A) 形式存储，无压缩。
而纹理压缩顾名思义是一种压缩的纹理格式，它通常会将纹理划分为固定大小的块(block)或者瓦片(til
e)，每个块单独进行压缩，整体显存占用更低，并且能直接被 GPU 读取和渲染(无需 CPU 解码)，举例来说，一张1024x1024的、JPEG 图片，使用RGBA格式，显存占用在 4M~5.3M 左右，而如果采用 AST_4x4 纹理压缩格式后，理论内存占用约在1.3M左右，相比普通纹理，可以减少70%+内存，具体数据见本文第三部分。
除此之外纹理压缩支持随机访问，随机访问是很重要的特性，因为纹理访问的模式高度随机，只有在渲染时被用到的部分才需要访问到，且无法提前预知其顺序。而且在场景中相邻的像素在纹卫中不一定是相邻的
性能高度依赖于纹理访问的效率。综上，相比普通格式图片，纹理压缩可以节省大量显存和 CPU 解码时间，且对GPU 友好。
在WebGL上，我们可以通过相关 Extension 使用纹理压缩。纹理压缩的格式有很多种(详见下文)，并且不同的厂商和机型支持的格式也不完全一致，因此使用压缩纹理前，需要判断设备是否支持。实际开发早，一般不会直接使用WebGL API加载压缩纹理，而是使用游戏引擎，目前主流的游戏引擎如 pixi.js 等均支持纹理压缩，开发者可以不用关心其中细节，只需要跟普通图片一样传入素材地址，剩下的都交给引擎来做。
纹理压缩不是银弹，虽然优势很多，但是其自身也有一些使用限制，主要有:
有损压缩。所有的压缩纹理均为有损压缩，因此需要开发者 or 设计师验证压缩效果是否符合预期:
尺寸要求。部分压缩纹理要求宽高相等(PVRTC)，或者宽高必须是2的幂次方，使用有些不便:
体积。压缩纹理虽然显存占用小，但是文件体积通常会比JPEG 更大(看具体压缩格式)，IO时问会更长;格式&兼容性问题。压缩纹理格式多样，需要针对不同平台选用不同格式，意味着同一份素材可能需要存储多份格式:
因此，是否需要使用压缩纹理需要开发者进行权衡，比如，游戏首侦资源我们通常希望越快约好，这时可以使用普通纹理，而对于非首顿资源或者出现内存瓶颈时则可以考虑使用纹理压缩。
带你读《2022技术人的百宝黑皮书》——内存优化: 纹理压缩技术（2）https://developer.aliyun.com/article/1340979?groupCode=taobaotech
