weekly
第 106 期 12/05 New to the web platform in November
Source: The large, small, and dynamic viewport units
技术热闻
New to the web platform in November
In November, Firefox 107, and Chrome 108 became stable. Let’s take a look at what this means for the web platform.
For over a decade, the App Store editorial team has taken a moment at the end of the year to celebrate the very best apps and games. It’s our honor to celebrate this year’s winners. Enjoy!
大前端
CSS
The large, small, and dynamic viewport units
New CSS units that account for mobile viewports with dynamic toolbars. svh / lvh / dvh.
In this tutorial, I’ll take you on a tour of the different options. We’ll see how they work, how we can decipher them, and how we can use them to our advantage. Later, I’ll show you how modern CSS lets us make on-the-fly adjustments, if we pick the right color format.
社区的解分 4 个大方向。1）CSS Modules，2）CSS in JS，3）Atom CSS，4）Atom CSS in JS
JS
Developing Faster JavaScript Apps: the Ultimate Guide to Web Workers
In this tutorial, we’ll introduce web workers and demonstrate how you can use them to address execution speed issues.
How We Made JavaScript Stack Traces Awesome
In this blog post, we want to explain why source maps are insufficient for solving this problem, the challenges we faced, and how we eventually pulled it off by parsing JavaScript. This is a fairly thorough list of differences between React for the web and React Native
Dependency injection in JavaScript
In this article, you learned about dependency injection in JavaScript, its pros and cons, examples in popular JavaScript frameworks, and how to use it in a vanilla JavaScript project.
React
React vs React Native: How Different Are They, Really?
mobile application development is a very different world from browser-based application development, so naturally developers will need to learn new tools, paradigms and techniques.
Security
NPM security: preventing supply chain attacks
Supply chain attacks have taken many forms — such as dependency confusion attacks, spearheading malicious code backdoors in open source packages, and compromising build pipeline infrastructure. In this post, I intend to unveil npm security practices and tooling available for you as a JavaScript developer (TypeScript developers are welcome too).
VSCode
Migrating VS Code to Process Sandboxing
In this blog post, we provide a detailed overview into how we managed to enable process sandboxing in VS Code, a journey that we started in early 2020 and plan to finish at the beginning of 2023. To help understand the challenge of process sandboxing, this blog post also describes details of the VS Code process model and how it evolved during this journey.
CloudIDE
CloudIDE 不是 WebIDE，不是简单的将 IDE 搬到云端，它解决的不仅仅是随时随地编码问题，更重要的是利用云原生的基础设施标准化开发环境，并且可根据实际业务场景进行扩缩容，基于 web 方便和各个业务平台打通，从研发层面为整体研发链路进行提效。
智能化
从技术的发展脉络来看，蚂蚁端智能的应用场景主要有 2 个方向：认知智能与数据智能。
本文将从 GUI 中用户体验的构建开始，用高质量、可调控、交互体验创新三个部分，分别介绍如何从传统 UI 一步步迈向 UI 智能化。最后，用如何实现 UI 智能化的一些思考收尾。
音视频
How to capture single frame from an HTML video
You ever want to grab a still frame from a video you’re watching online? Here’s a trick I use from time to time to get video stills from HTML <video> and avoid all the fussy hover-activated UI bits.
体验度量
介绍支付宝客户端面向场景的性能诊断和体验优化方案。
单纯地依赖硬件性能以及带宽的提升、来水到渠成地提高应用性能是不行的，我们需要自主地对应用的体积进行一些分析和优化。接下来我们将一起以傻瓜模式来分析应用的体积
最佳实践
Traditionally, many of our API models tend to be centered around the raw data that’s needed for clients to render a view, which we refer to as data modeling. A render model is an API modeling strategy where the server returns data that describes the view that will be rendered.
发布
Electron 22.0.0 has been released! It includes a new utility process API, updates for Windows 7/8/8.1 support, and upgrades to Chromium 108, V8 10.8, and Node.js 16.17.1. Read below for more details!
设计
设计作为距离用户最近的一方，在平衡各方诉求后呈现给用户一个全新的游戏氛围感十足的产品，是本次改版的终极愿望。希望能量满满、生机焕发的QQ游戏中心改版能给大家带来一些启发。
总结本次语音搜索的改版升级，我们通过“构建伙伴认知、满足情感互动、增强沉浸体验”等手段，增强AI伙伴的曝光率，进一步向用户传达智能搜索的感知，从而促进搜索行为转化。
本文站在游戏体验设计视角，通过三方面内容：
- 怎么玩-如何构建玩法策划框架降低用户理解门槛
- 持续玩-如何通过游戏内容提升用户留存粘性
- 有的玩-如何结合有用户分层扩大用户覆盖
尝试与大家探讨关于调动用户参与积极性、提升游戏体验感、助力业务指标的设计思考。
拓展
有趣小玩意
如果没有办法摆脱鱼缸，能不能在鱼缸里面创造出更多的空间，提高生活的趣味和满意度？
欢迎加入，一起共建「前端周刊」