Web Almanac 2024 & VSCode M11

国内

[微信开发者] 零售电商、微信小程序、安全防护

零售电商类微信小程序安全防护要点指南
零售、电商类小程序易受黑灰产攻击，影响商家活动。文章总结了常见安全问题并给出防护策略，还介绍了微信团队推出的微信网关，它具备系统化、多层级安全防护能力，能精准识别并拦截黑灰产手段，提供弹性资源包，适合突刺流量场景，支持小程序自助一键接入，无需代码改动和版本发布。

[携程技术] 前端开发、携程商旅、Remix框架

干货 | 携程商旅在 Remix 模块预加载中的探索与优化实践
文章总结了携程商旅大前端团队在将Remix框架从1.0升级到2.0过程中，针对Vite在动态模块加载优化中引发的资源加载问题的解决经验。详细探讨了Vite优化DynamicImport的机制，包括表象、机制、原理等方面。还介绍了商旅对DynamicImport的内部改造，如对Remix和Vite逻辑的优化，以解决404问题。最后提及商旅前端团队技术采用情况、Remix的优势和后续分享计划。

[Goodme前端团队] 前端开发古茗 Request请求库

浅谈古茗内部的Request请求库
文章介绍了前端请求库在Web开发中的重要性，对比了XMLHttpRequest、Fetch API、Axios和古茗内部的Request请求库。分析了各请求库的优缺点、核心特性、请求流程、基础用法、错误处理等方面。强调Request库的标准化、无外部依赖、功能全面等优势，解释了选择Request库的原因是标准化需求、易用性提升、业务逻辑收敛、体积控制和性能优化等。

[转转QA] 质检埋点治理数字化

质检数字化埋点治理探索
本文阐述了转转质检数字化埋点治理的探索。首先介绍质检中埋点数据的重要性，然后指出之前埋点存在的问题。治理分为两个阶段，第一阶段是人工执行，由QA主导，明确职责、规范流程，提升了QA参与覆盖率；第二阶段是系统监控，包括实时校验能力、用户行为树、埋点数据看板、双周质量分析报告等。最后总结治理成果，如异常埋点大幅减少、测试提效等，并提出未来构想。

[转转技术] MySQL 数据库日志 ACID特性

MySQL核心揭秘:从查询到修改，彻底理解 Undo Log、Redo Log、Binlog 与 ACID 的关系
本文深入探讨了MySQL中的Undo Log、Redo Log和Binlog日志机制及其在保障事务ACID特性中的作用。介绍了MySQL架构、服务层功能与组件，阐述了查询和修改语句执行过程，包括各日志在其中的操作流程，如Undo Log的事务回滚和MVCC功能、Redo Log的日志执行过程与刷盘策略、Binlog的刷盘时机与功能，最后强调掌握这些日志机制对数据库性能优化、故障恢复等的重要性。

[AndroidPub] Android、崩溃率收敛、代码优化

Android 崩溃率收敛至 0.01% 实践
文章介绍了Android工程中崩溃率收敛的实践，包括崩溃收敛机制（创建修BUG分支、查看Dump后台等）、崩溃容灾机制（利用Handler机制开发框架拦截崩溃）、其他崩溃收敛（空指针、索引越界等常见问题的解决）、OOM问题收敛（内存泄露监控等）、线程和FD数量监控等内容，还提到了提升代码质量、探索前期审查和工具扫描的方式来降低线上问题概率。

[搜狐技术产品] Flutter Navigator2.0 Web端实践

Flutter Navigator2.0的原理和Web端实践
本文主要介绍了Flutter Navigator2.0的原理与Web端实践。首先阐述了Navigator2.0推出的背景，即Navigator1.0存在局限性。接着讲述其主要特性，如声明式API、嵌套路由等。还介绍了核心组件Router、RouteInformationProvider等。然后给出简单实例，并简析源码。最后结合狐友业务讲述了Web端实践，包括需求、具体实现等。总结指出Navigator2.0使路由管理更灵活强大。

[GSYTech] 纯血鸿蒙卓易通系统升级

纯血鸿蒙支持 Apk 兼容运行和系统升级的最后一块拼图:「卓易通」正式上架纯血鸿蒙
文章先提及之前介绍过纯血鸿蒙运行Android App时发现的‘卓易通’如今正式上架，这使得鸿蒙Next的‘可用体系’完整。然后对比‘出境易’和‘卓易通’的机制、功能等，‘出境易’是白名单机制对应Google Play，‘卓易通’黑名单方式对应华为应用商店。‘卓易通’上架后支持搜索补全，其可能通过容器化运行App，虽有性能问题但能用，最后还谈及这对各方的影响。

[GSYTech] Flutter Web开发渲染器

Flutter Web 正式移除 HTML renderer，只支持 CanvasKit 和 SkWasm
Flutter Web将正式移除HTML renderer，只支持CanvasKit和SkWasm。谷歌2023年初提出调整路线，今年初官方官宣弃用计划，12月功能将合并到beta版。弃用HTML renderer是因CanvasKit和Wasm更贴合技术路线，新方案下有性能提升、启动时间改善等优势，Flutter Web定位不适用于文本丰富的静态网站，SEO仍是问题，官方在探索解决，Flutter对Web比较上心。

[快手大前端技术] 快手前端动效

快手前端动效大揭秘:告别低效，vision平台来袭!
文章介绍了快手Vision动效平台。先阐述动效的核心价值与现存挑战，包括其重要性和流程中的难题。接着探讨行业内通用解决方案，分析快手动效开发特点与需求，引出Vision平台的演进路线和功能拆解。还讲解了平台的核心功能，如动效的准入与准出管理机制，动效开发提效的相关措施等。

[Taro社区] duxapp 鸿蒙兼容 UI库

duxapp:首个支持鸿蒙的 UI 库，同时还兼容 React Native、小程序、H5
duxapp是首个支持鸿蒙且兼容多端的UI库。文章介绍了duxapp兼容鸿蒙前的状况，包括样式兼容性和现有模块。还阐述了Taro和鸿蒙的现状，duxapp选择了@tarojs/plugin - platform - harmony - ets方案。接着讲述了兼容鸿蒙的过程，如创建模块、添加依赖、配置依赖项、处理工程文件、组件库兼容等。最后提及开始使用的方式、当前版本的问题和未来展望。

[京东技术] MySQL SQL优化 JOIN算法

从MySQL JOIN 算法角度看如何优化SQL
文章主要从MySQL JOIN算法角度探讨SQL优化。先介绍单表查询优化多从索引入手，而多表联合查询是慢SQL重灾区。接着详细阐述MySQL的几种JOIN算法，包括Simple Nested - Loop Join、Block Nested - Loop Join、Hash Join和Index Nested - Loop Join的原理、优缺点及执行计划对比。还通过测试SQL逐步分析优化思路，强调不同情况下如何选择合适算法，最后指出多表关联时可将前两表结果视为新驱动表处理。

[京东技术] 应用启动速度优化 SpringBoot 京东零售技术

大促实战之应用启动速度优化 | 京东零售技术实践
本文记录了11.11大促前针对SpringBoot应用启动速度过慢采取的优化方案。先阐述应用启动过慢的问题背景，包括部署、联调等耗时过长的影响。然后介绍多种排查方法，如使用SpringBoot的监控actuator、分析启动日志、自定义BeanPostProcessor方案，还提及Tomcat版本和机房对启动速度的影响，最后总结方案，通过各项优化使应用启动速度提升近60%。

[哔哩哔哩技术] B站评论系统、多级存储架构、数据一致性

B站评论系统的多级存储架构
B站评论系统是其生态重要部分，架构主要依赖Redis缓存和TiDB存储，存在TiDB单点故障等问题。基于泰山KV存储搭建多级存储架构，将排序索引存储从结构化转为非结构化，数据类型从SQL转NoSQL。存储设计包含Index和KV两种模型，数据一致性方面存在问题，通过重试队列、版本号机制、对账系统解决。还介绍了降级策略，选择对冲策略平衡响应时间和资源消耗，最后对评论服务进行总结展望。

[哔哩哔哩技术] B站大数据故障自愈

B站大数据平台故障自愈实践
本文讲述B站大数据平台故障自愈实践。随着B站业务发展，大数据面临规模大、管理复杂、环境异构等挑战。故障自愈系统涵盖数据采集、分析、处理和决策定义，采集多类数据，元仓整合数据。决策定义针对不同故障构建知识库，故障分析包括识别和降噪，故障处理有防呆策略、流程生成和自愈机制。案例分析以磁盘故障自愈为例，系统已应用于多个组件和场景，未来将拓展范围并引入机器学习技术。

[货拉拉技术] 货拉拉、客服IM系统、技术研发

聚焦沟通:货拉拉自研客服IM系统
货拉拉因第三方IM系统灵活性和定制性不足，自主研发客服IM系统并稳定运行三年。文章阐述其设计理念包括以司用为中心、虚拟客服助手、实时性与高可用性、数据安全等，介绍技术架构、选型，还提及技术挑战如网关设计、会话数据存储、消息ACK、人工排队机制及解决方案，最后讲述系统演进、收益分析、未来展望等内容。

[奇舞精选] React性能优化 react-scan 前端开发

构建更高效的 React 应用:react-scan 的使用与原理探究
本文介绍了react - scan在React应用性能优化中的使用与原理。首先阐述了React应用中组件重渲染导致性能损耗的问题及react - scan出现的必要性，接着讲述其优点，如实时监控、实施简单、提供视觉反馈等，然后介绍安装配置和基本用法，包括Script标签引入、NPM安装等，还讲解了其核心原理，最后总结react - scan对React性能优化的意义。

[InfoQ] React 19 新特性升级方法

React 19 稳定版发布:新特性介绍和升级方法
React 19稳定版已在npm发布。文章介绍其新特性，如动作和异步转换、useOptimistic钩子、use API、原生元数据管理等，还有增强的样式表和脚本管理、稳定的服务端组件等。同时阐述了改进之处，像错误处理、Ref作为Prop等。也提及了如何升级到React 19，包括遵循升级指南、注意重大更改等，最后鼓励开发人员探索。

[得物技术] Android、字节码、插桩

二十万分之一几率:if语句变do-while卡死问题分析|得物技术
文章讲述了某次灰度发布后线上ANR告警，定位到是页面onCreate方法执行太久，原因是监控代码中if语句变成do - while形成死循环。经分析，问题源于插桩代码所在plugin weaver，在多线程高并发复制methodNode时，由于ASM处理labelNode未适配多线程，导致jumpNode和指令链表中LabelNode不一致。最终通过加类锁解决问题，并总结此类多线程字节码问题的特点与危害。

[大淘宝技术] 大模型、技术原理、CoT、理由先行

大模型“翻车”背后的技术原理及解决方案
文章从大模型在'草莓有几个r'和'9.9与9.11比大小'这类简单问题上翻车的现象入手，剖析背后的技术原理，包括Tokenization和预测下一个Token的问题。阐述了CoT方法解决此类问题的原理，还提出'理由先行'的Prompt Trick，通过物流业务场景示例展示其有效性，并建议在Prompt编写与调优中采用这种风格。

国外

Visual Studio Code 2024年11月更新功能改进

November 2024 (version 1.96)
这篇文章介绍了Visual Studio Code 2024年11月（版本1.96）的更新内容，包括Copilot的功能改进、调试功能、工作区功能、可访问性改进、编辑器功能、源代码控制、笔记本功能、终端功能、测试功能、语言支持、远程开发、企业支持、Python环境扩展等多方面的更新，还提及了一些修复和贡献者致谢等内容。

[CraftWarmAI] UI Agent、ShowUI、开源模型

ShowUI:当前最好的 UI Agent 开源模型?
ShowUI是Show Lab和微软推出的刚开源的UI Agent模型，在中文APP定位和导航能力出色。它基于Qwen2 - VL - 2B做Lora微调，模型和代码开源。论文有3个主要贡献，包括视觉token选择、训练数据组织方法和构建高质量预训练数据集，还介绍了预训练、微调等内容，UI Agents知识星球提供相关技术解读。

5 Technical Trends To Help Web Developers Stand Out in 2025

https://thenewstack.io/5-technical-trends-to-help-web-developers-stand-out-in-2025/
2024 had significant web dev events. AI was accepted by many devs. In 2025, five non - AI web dev trends will help devs stand out. Vanilla JS is regaining importance as it offers lean, dependency - free code, reducing complexity compared to frameworks. Frameworks can add unnecessary bloat. Vanilla JS also aids in troubleshooting and optimizing code.

Improving User Experience for Multilingual Web Browsing

https://htmhell.dev/adventcalendar/2024/13/
The article focuses on improving user experience in multilingual web browsing. It discusses issues with browser auto - translate, such as inaccuracies, especially with proper names and technical terms. It shows how the 'translate' attribute can prevent misinterpretations, compares it to non - standardized approaches like 'notranslate' class, and emphasizes the importance of manual content testing to avoid translation errors.

CSS Web Development 2024 Features

CSS Wrapped 2024
2024 has been a great year for CSS. It has new features like cross - document view transitions, scroll - driven animations, etc. Components such as field - sizing, animate to height:auto, exclusive and styleable

, anchor positioning are introduced. Interactions include custom scrollbars, cross - document view transitions, scroll - driven animations and snap events. Developer experience is also enhanced with backdrop inheritance, light - dark() function, @property, etc.

Web Almanac 2024 HTTP Archive

Web Almanac 2024
The Web Almanac 2024 is HTTP Archive's annual web report. It combines stats and trends with web community expertise. This year's edition has 21 chapters. The Featured Chapter on CMS shows improvements in performance and user experience. 83 people contributed. The report used data from testing 16.9M websites and processing 83 TB. The June 2024 dataset was the basis for its metrics.

Multilingual Web Browsing User Experience

Improving User Experience for Multilingual Web Browsing
The article focuses on improving user experience in multilingual web browsing. It discusses issues with browser auto - translate, such as inaccuracies, especially with proper names and technical terms. It shows how the 'translate' attribute can prevent misinterpretations, compares it to non - standardized approaches like 'notranslate' class, and emphasizes the importance of manual content testing to avoid translation errors.

Node.js JavaScript Security

Node.js Delivers First LTS with require(esm) Enabled, Enhances Security and Release Automation
Node.js v22.12.0 (LTS) has been released with require(esm) enabled by default. This is an experimental but important feature for ESM adoption. The release process has been automated, and there are security enhancements. The number of security reports in October - November 2024 was low, which is attributed to updated security policies.

产品

[谷歌开发者] Gemini 2.0 Google AI模型

Gemini 2.0: 我们智能体时代的最新 AI 模型
文章介绍了Google推出的Gemini 2.0模型。首先回顾了Gemini 1.0的成果，然后阐述Gemini 2.0的新进展，包括新功能、性能提升等。还提到将2.0开放给开发者和测试人员，以及在产品中的整合情况。此外介绍了基于Gemini 2.0的研究原型，如Project Astra等，最后强调在智能体时代负责任构建的重要性。

[知识共享计划] 360搜索 AI产品纳米搜索

360AI搜索，完了。
11月27日360发布纳米搜索（360AI搜索升级版），网站、APP、小程序同时上线。文中提到搜索引擎三阶段理论，360的AI生态优势，其AI全家桶集成众多大模型与AI工具，AI内容工厂可进行创作转换。但产品存在问题，如使用时输出内容幻觉等。还探讨AI是否为新工作方式，指出目前AI产品生产力浮于表面，未达根本需求。

[科技华] 鸿蒙微信华为科技

鸿蒙微信正式版，发布时间确定!
12月14日纯血鸿蒙版微信1.0.2.42版本上架华为应用市场尝鲜专区可下载，新增三个变化。目前采用邀请内测方式更新，稳定后放量上线。实测聊天记录等可正常转移。有媒体咨询华为客服，鸿蒙版微信正式版预计2025年推出，可能于春季上线。目前测试版已能满足大部分日常需求但仍有小问题待修复。

设计

[钉钉用户体验] 钉钉鸿蒙版办公协作

纯血鸿蒙版钉钉的三大体验亮点
钉钉与华为技术团队合作打造纯血鸿蒙版钉钉。它有三大体验亮点：多屏一致体验，基于鸿蒙特性实现多端丝滑体验、遵循‘一多’设计原则、增强多窗能力；跨设备互联，借助鸿蒙分布式技术实现设备无缝连接、多设备接力功能方便信息同步与操作；智能化，与小艺智能力深度融合实现文档翻译总结、快速拉会等。钉钉还在基础体验上进行优化改进，虽有不足但会持续提升。

[58UXD] Recraft AI图像工具设计领域

这个AI神器要把文生图的天捅破了!怪不得这么火!
文章介绍了Recraft这款强大的AI图像生成与编辑工具，包括其功能、使用方法、优势等。它有文生图、框架、图片集、产品图等核心功能，操作便捷且功能丰富，如多种风格模型、多功能编辑、风格迁移训练等，还有活跃的设计师社区，对创作者很有帮助，有望成为更多创作者的首选工具。

[群核科技用户体验设计] 体验设计、情绪价值、用户体验

情绪价值在体验设计中的应用
文章阐述了情绪价值在体验设计中的应用。首先解释情绪价值概念，然后从对用户体验影响、适用产品、设计师提升方法、量化条件几方面展开。情绪价值影响用户满意度、容忍度、忠诚度等，C端和B端产品都适用，设计师可从用户研究、设计、测试优化阶段提升。虽有量化方法但难以完全量化，不过情绪价值在体验设计中作用重大。

[体验进阶] Ant Design、AI设计范式、人机交互

AntDesign放大招，推出一套AI设计范式
自ChatGPT 3.5发布后，AGI影响到GUI，但AI产品界面设计存在诸多待探索问题。Ant Design团队构建并沉淀出RICH设计范式，包括Role、Intention、Conversation、Hybrid UI四个核心要素。文章还阐述了为何是RICH范式及如何使用该范式创造卓越AI产品体验。

行业/组织/个人

[腾讯研究院] AI教育、教育变革、教育辩论

AI时代的教育之问II:教育变革
北京大学教育学院与腾讯研究院等开展AI+教育思想系列沙龙。第2期聚焦‘AI时代的教育变革’，以辩论形式探讨AI对教育影响是革命性重塑还是渐进性演进。正反方就二者本质区别、AI是否带来教育颠覆性变革、AI推动教育发展的方式展开辩论，正方认为是革命性重塑，反方认为是渐进性演进，双方从多方面阐述观点并提供论据。

Generative AI AI Market Agentic Applications

Generative AI’s Act o1
文章探讨了生成式AI的发展，基础层市场结构渐趋稳定，推理层成为新前沿。OpenAI的o1模型具有真正的通用推理能力，这是从预训练本能反应到深度推理的跨越。还提到新的缩放定律，推理时计算越多，模型推理能力越强。同时阐述了模型不会一家独大，应用层机会多，认知架构很重要，以及新的代理应用正在兴起，不同类型公司的发展模式不同，最后对投资领域进行了分析。

[科技公寓] Adobe 剪映企业竞争

Adobe跌倒，剪映吃饱;2000亿美元的争夺战!
Adobe发布财报后股价一夜跌13%，虽财报数据稳健，但2025年营收指引略低于预期且AI产品变现不佳。竞争者增多的情况下，剪映成为话题中心，其2024年收入三位数增长，功能丰富且整合多项热门功能，价格相对便宜，虽会员年费上涨但权益更多。Adobe用户多为专业创作者，剪映用户多为个人创作者，剪映形成‘创新飞轮’，Adobe能否守住地盘值得关注。

[环球旅讯] 美团企业版企业消费管理降本增效

对话康凯:美团C端的业务都值得在B端重新做一遍
文章围绕美团企业版展开，首先指出企业消费管理市场规模大且处于早期阶段，美团企业版在用户体验和多场景方面有战略优势。接着阐述了其客户画像的变化、下沉市场情况、费用、企业接入准备、降本增效的作用及方式、国际业务难点等多方面内容，最后提及美团企业版的增速与未来目标。

[愚者笔记] 裁员反脆弱 Notion

从字节离开后:开展我的反脆弱计划
作者自2022年字节裁员后，意识到失业带来的脆弱性，从黄金圈法则阐述反脆弱计划。分析产生脆弱感的债务、单一收入、身体素质下降三因素，针对各因素制定可量化目标，如经济、职业、健康方面的目标，还介绍了Notion工具。并分别阐述经济、职业、健康目标的实践方向，最后强调监督追踪机制，发现不稳定因素的威胁度在消退。

焦虑、产品、个人成长

SP04.放弃焦虑，意味着忽略来自未来的信号
文章以如果一辈子只有20次做产品的机会为引子，探讨焦虑相关话题。指出焦虑不是要被打败的敌人，而是提醒关注未来的信号，有其价值，如促使行动、激发创造力。还阐述了如何与焦虑相处，要理解焦虑传达的信息，分辨有用与无用的焦虑，无用的焦虑可沉浸于当下心流，有用的焦虑可推进事情发展。

周刊

国内