Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

大前端快报 No.1 - No.44 合辑 #54

Open
int64ago opened this issue Jan 7, 2021 · 0 comments
Open

大前端快报 No.1 - No.44 合辑 #54

int64ago opened this issue Jan 7, 2021 · 0 comments

Comments

@int64ago
Copy link
Member

int64ago commented Jan 7, 2021

大前端快报 No.44

从一名新入职的 FB Reacter 的角度,看看 React 团队的氛围与合作模式。

Casbin 是一个强大的开源权限控制库,支持 RBAC、ABRC 等模型,各语言都有 SDK 支持。

可以收藏留以备用的高性能 Node.js logger。

一份描述如何在 App Store 之外分发 Mac Apps 的指南。

对比了 Clang 与其他开源的编译器。

在本文中,我们将总结来自一些公司的官方工程博客的经验教训。为什么要做代码评审?除了作为一种质量保证的工具,代码评审还有哪些好处?代码评审如何帮助提升团队能力?

客户端开发的同学都知道「安装包大小」是 App 重要的基础体验指标之一。本文将为大家介绍抖音在优化安装包大小方向做的一些探索和尝试。

大前端快报 No.43

介绍了 Apple 生态的跨平台技术 Catalyst 的新特性。

虽然我一句话总结 Tailwind CSS 是颗粒度更细的 Bootstrap,但是文章依然值得一看。

实用 Tailwind CSS 尝鲜。

允许浏览器将鼠标滚轮或者键盘滚动解释为预期滚动条的百分比,这意味着在启用该功能之后滚动体验会更加流畅。

Wasm 是一个 WebAssembly 运行时,支持各种平台,甚至 IoT 设备。

大前端快报 No.42

一个小巧的命令式的用于写歌的编程语言

一款可以在 VSCode 中编辑图片的插件

一些使用 使用 Chrome DevTools 调试 CSS Grid 的小技巧

Stimulus 不像现在的 React、Vue 等会接管 HTML 并按它们机制渲染,它充分利用原生 HTML,配合 JavaScript 实现现代化框架。

从载入、编译、执行、内存等角度对比主流 JavaScript 框架(库)的开销,毫无疑问,jQuery 还是那么优秀。

从各个角度分析性能问题并给出解决方案。

大前端快报 No.41

Flutter 自发布到目前的 1.22 版本,已经走过了两年多的时间,这段时间以来,Flutter 一直都是跨端开发的风口浪尖,这个时候很多人不禁要问:那么未来还是么 ? 又该如何抉择 ?本文将给你这些问题的答案。

AppClip 是今年 WWDC 的一大亮点,现在苹果已经正式推出 AppClip 码,只需将 iPhone 靠近轻 App 码或用摄像头扫描该代码,即可打开您的轻 App 并快速完成需要的任务。

在这期视频里,我们会从苹果 M1 的架构分析、CPU 及 GPU 理论性能表现、MacBook Pro 13 上 M1 的功耗及温度表现等方面深度挖掘 M1 的表现以及 M1 内部的秘密。

MonkeyDev 的一种应用,蛮好玩的。

尽管我们现在写 Web App 有很多框架或库可以直接使用,但是这之下的最基本的设计原则却是大同小异的。

很像程序员的格子衫,可以在线调整好直接用在实际项目里。

作者总结了自己写 CSS 过程中的一些思维转变,有一些最佳实践的总结。

大前端快报 No.40

跟 React Server Components 类似,看起来前后端不分离的趋势真的来了。

如何与 type-checker 交互的系列教程(4 个章节)。

罗列了原生实现日期转换的各类方法,并给出了性能测试数据,非常适用于对性能敏感应用场景。

大前端快报 No.39

新增 6000 万新仓库;JavaScript 依然最热;安全更新速度提升显著;给出平衡工作与生活的一些建议

React 官方新出的组件形态,目前还处于实验阶段,目测影响力会跟 Hooks 差不多。

可能基本没人用 Flux,不过近期发布了 4.0.0,这是最后一次大版本更新了,进入维护状态。

Android Gradle 插件的一个大版本,从 7.0 开始会采用语义化版本方案。

本文介绍了主流的几个 Node 爬虫工具、库,会有些简单对比分析。

大前端快报 No.38

这是个很小的功能,但是非常方便包使用者去判断该包是否内置 TS 声明。

初入 TypeScript 有效避坑。

简介最近常出现的名词 JAMstack。

比较系统,图文并貌, 吃完饭没事的话,可以瞅瞅。

大前端快报 No.37

官方给出了 2021 的规划,计划会更好地融合 ESM,以及把 CSS、HTML 也纳入到原生模块体系中。

不久后在 Android 上就可以实现 Chrome 跟 NFC 设备交互了。

包含了这一年里值得反复回味的设计作品。

有点标题党了,只是一些优化 CSS-in-JS 性能的方法,有一定参考意义。

一篇把 React 里的 useRef 各方面介绍得比较全的文章。

作者告诉我这不是我一个人的错觉。

文章带我们了解动态链接和静态链接的原理,有助于我们从底层原理方面去解决各种疑难问题。

大前端快报 No.36

作者在 2018 年给 iOS 和 macOS 报了一个 WebKit 沙箱逃逸漏洞 CVE-2018-4310,苹果先后在 macOS 和 iOS13上修复了这个漏洞。本文详细讲述了这个漏洞的原理,以及如何在 iOS 上做一个杀不掉的 App,是一篇 iOS/macOS 上安全相关的高质量文章。

还在为内存问题掉头发却又手足无措的老铁们可以瞅瞅这个

一个更简单的测试 Flutter App 的方式,同时支持 Firebase 的 Test Lab。

图片加载性能优化的新思路

快来试一试你的应用可有多少提升空间

使用了 Wasm threads & SIMD 等技术,分为左右两屏,可以很方便地做转换前后对比。

使用 css 实现文字竖行

大前端快报 No.35

如果有人问你如何学 JavaScript,给这个链接就对了。这个教程覆盖很广,且只关注现代 JavaScript 特性。

是否有尝试过在 Android 上加密数据?Jetpack Security 提供了相关库用来加密文件等。目前 Jetpack Security 还在 RC 阶段。

历时 2 年,适配 Vue 3 的 Vue Router v4 来了,体积更小,TS 支持,以及更多新特性。

第一个使用 TypeScript + Vue 3.0 Composition API 重构的组件库 Element Plus 发布了

普天同庆,GitHub Dark Mode 来了,重点是官方这个宣传视频很不错。

这个网站输出仅仅是个合法的 JSON,但是却正确的渲染为网页,原理就不说了,有兴趣的自己看吧。

文本可能是解释 Margin 重叠最好的文章了吧,关键是其表现形式也非常友好。

大前端快报 No.34

你是不是经常需要自己实现一个 Promise 的 setTimeout 配合 await 使用?其实 Node 内置了。

开发阶段,Snowpack 结合 Skypack 自动把 import 的包变为预构建好的 CDN 资源,从而避免了开发阶段的 npm install 及构建。

这是一个很小的 JS 库,可以给页面的元素创建手绘风注解,挺好看的,还能动哦。

12-10~11 两天,全程直播,不过国内是凌晨了。

一起回顾下这些年 JS 的发展吧。

大前端快报 No.33

这是个 iOS 的漏洞,并且在 iOS 13.5 上已经修复了。效果可以从视频中看到,文章非常详细的分析了该漏洞的原理。

在最新的 AS 4.1(目前还在 Canary 阶段)新增了一个新的工具 Database Inspector,可以修改运行中 APP 的数据库。

鉴于在开发 Flutter 过程中遇到的一些问题,西瓜视频 Flutter 基础团队开发了一款调试工具包 UME,内部集成了丰富的调试工具

Realm 是一个专门为移动端设计的数据库。主要特点是性能好,易使用。MongoDB 是一个流行的 NoSQL 数据库,主要是在服务器端使用。MongoDB 收购 Realm 半年后推出全新的 MongoDB Realm。本文介绍了 MongoDB Realm 的基本功能和使用方法。

大型 App 往往承接着来自不同团队的业务,可能各个业务组都有着自己的产品、设计和研发团队。随着版本的不断迭代,大型 App 在设计层面、研发层面、测试层面和产品层面均会面临着效率低、UI 体验不一致等问题。美团外卖团队分享了他们在移动端 UI 一致性解决方案上的探索。

使用 fieldset 和 legend 给边框增加文本,看起来可以实现一些很特别的效果。

如何优雅的获取一个数组最后一个元素?目前 .at() 方法提案已经进入 Stage 3。

Storybook 的扩展已经超过 200,但是如何创建并分享给其他有需要的人还不是很容易。这是官方给的一个非常简洁的指南。

大前端快报 No.32

Aleph 借鉴了很多 Next.js 的特性,让 Deno 也可以做到几乎零配置写 SSR。

在 Firefox Nightly 版本里,可以通过 flag 开启瀑布流布局的支持,这个是基于 Grid 布局实现的。

越来越多的人机交互设备,如游戏手柄、触摸屏等,WebHID 的支持让这些设备可以直接跟 Web 页面互动。

大前端快报 No.31

可以通过 Hermes 构建 iOS 应用,React 17 支持。

针对目前手机折叠屏的趋势,Web API 也出了相关提案。

Storybook 是一个标准化的 UI 组件工作坊,6.1 支持 React 17 且提供更快的刷新速度。

一个非常新颖的 Web 全栈方案,没有像传统做简单组合,而是整了个 DSL。

在有 fixed 头的页面,一般锚点快速定位会有偏移的情况,scroll-margin-top 可以比较优雅地解决这个问题。

大前端快报 No.30

配色跟音乐一样,不是简单的堆砌就可以,同样的颜色,不同方式安排会产生截然不同的视觉效果。

本文是扔物线朱凯在GDG上分享的图文整理,文章很好的介绍了什么是 JetPack Compose 以及 JetPack Compose 的优势—— “它重新定义了 Android 上 UI 的写法”

这个混合所有新特性(提案)的代码已经几乎无法看懂了,学不动了。

全新的 JavaScript 解释器,支持 TS 4.1,并且为现代浏览器单独抽离一个 ESM 包。

值得关注的一个重大更新是,新增了字符串模板类型 Template Literal Types

这是一个小而美的产品展示集聚地,非常多的交互、视觉、技术相关的产品。

大前端快报 No.29

理论上 ESM 普及后 Web 应用是不需要 Webpack 之类的打包器的,但是这天到来前也可以借助一些曲折方式提前体验。

Flutter | Web | Material Design

本文通过对国内各大厂旗下知名的应用进行分析,大致统计分析各大厂在移动跨平台开发领域的接入情况,同时分析 Android 端应用的 arm 框架、 kotlin 和 androidx 的使用状态。

现在基本看不到 HTTP 的站点了,Firefox 则做的更激进一点,在 Firefox 83 提供 HTTPS-Only 模式,开启后如果遇到 HTTP 站点会主动拦截等待确认。

ESM 转 CJS 是很困难的,不同工具的做法和表现也有些不一样。文章比较干,慎点。

如何搭配Kotlin语言使用Hilt实现依赖注入

新特性还包括:新的 CSS grid 调试工具,开发工具面板支持垂直分屏,Lighthouse 更新 v6.4等等

大前端快报 No.28

Firefox 默认使用 SpiderMonkey 作为其 JS 引擎,通过 WrapBuilder 可以让 SpiderMonkey 更快,这个优化已经在 Firefox 83 上开启了。

针对最近很火的 Vue ref sugar 的一篇较客观的分析。

这个功能的主要目的是直接把 script 里顶层变量暴露给模板。

新的特性包括:字体自动内联,组件测试,报告和日志的提升,Webpack 5 实验性支持等

使用 JavaScript 创建 iOS 小组件。

Android NNAPI 可以帮助实现边缘计算,新加入的 PyTorch 让开发者不再局限于 TensorFlow Lite。

大前端快报 No.27

HTML 是 Web 的基础,这篇年鉴通过数据展示我们如何使用 HTML 的。

提供了比较多的改进,新特性包括:新的检查标志,编辑器生产力的更新,更好的性能提升等

HTTP/2 出来也有好几年了,但是 99.9% 的 HTTP/2 连接都没用到服务端推送,很难为这个特性找到使用场景。

Firebase 作为集中化的移动端和 Web 开发工作台,功能可能稍微多了点,supabase 声称是 Firebase 替代品,整个产品看起来简洁不少。

此框架采用的技术栈整体都很先进:TypeScript、Deno、SSR & SSG,值得尝试下。

大前端快报 No.26

Flutter 团队启动了第 10 次季度用户调研。在 10 天时间里,全球共有 7,668 位用户参与了调研。

因为 iPhone 12 的逻辑分辨率和之前的机型都不同。 使用 Xcode 12.0 打包,会让 iPhone 12 运行在兼容模式,不会出现问题。 而如果使用 Xcode 12.1 打包,则会使用 iPhone 12 固有的分辨率渲染界面。导致页面出现非常多异常情况。

深入探索 Android Gradle 插件的缓存配置

本文主要介绍性能监控系统中的APP卡顿监控,围绕卡顿这个性能指标,描述APP卡顿监控系统的搭建过程,分享京东商城APP卡顿优化实战经验和成果。文中 GPU FPS 这个概念比较有参考价值。

这是对用户隐私数据保护的又一措施。之前已经预告过。从 2020 年 12 月 8 日起,提交至 App Store 的新 app 和 app 更新都将需要包含隐私信息。

一个非常酷炫的 WebGL 模拟 DEMO,尝试使用鼠标操作一波吧。

Rust 写的,干的事情类似 esbuild,号称比 Babel 快 20-70 倍。

不知不觉已经 ES12 了,这里罗列了 ES12 最终确定的新特性。

大前端快报 No.25

因为 CSS 属性同时只能设置一次,所以针对 transform 只能设置一个动画,通过 WebAPI 结合 composite: 'add' 可以突破这个限制。

常见证书有 DV、OV、EV,其中 EV 证书因为在 TLS 协商阶段需要校验的内容过多会有一些性能影响。

在 React 的 CSS-in-JS 背景下,似乎使用 Context 换肤显得更符合逻辑,本文对比了 CSS Variables 方案,性能表现更为突出。

一个比较有意思的表现形式,把页面内容以纯 html 标签的方式展示。

动画满分,瞬间 GET 到精髓。

尽管写文件在客户端开发过程中是非常常见的操作,但是依然会时不时的遇到一些奇怪的问题。诸如读写文件不一致、写入过程内容丢失等。本文会对文件读写相关的几个 API 和其内部机制进行详细讲解,并对常见的几个问题一一解答。

苹果向开发者宣布,现已可在分发环境中使用新的订阅服务通知。苹果提供了用户订阅状态的实时更新通知,方便开发者更快了解自己服务的订阅情况。这对云音乐的会员订阅服务可能会有帮助。

如何落地设计规范,提升产研效率?本文介绍了积木 Sketch 插件进阶开发指南,实现一款可以与业务强关联且功能可定制的成熟工具。 文章涉及到前端/Xcode/视觉/工程效率等等多方面,是一篇很有价值的文章,值得学习和借鉴。

大前端快报 No.24

使用 Kotlin 编写两端代码。

iSH 是 iOS 上的一个 APP,通过 x86 模拟器来运行 Linux,所以理论上也可以跑 NodeJS 代码。

是时候让 Kuma 来推动 MDN Web 文档的发展了,MDN 开发者团队计划更新平台,这可以带来诸多好处,这对 MDN 贡献者影响较大。

这是 JS 语言奇技淫巧的集合,这些并不是什么好东西,并不是日常工作用推荐的,知道就好了,有些还是有意思的。

本文是作者对 SPA 模式问题的一些思考,同时也给出了一些可选方案。

看起来是个质量还可以的手绘风图表库,该有的都有,但是文字依赖 Web Fonts,所以中文可能效果就打折了。

大前端快报 No.23

如今,iPhone 12 、iPhone 12 Pro 系列正式发布,屏幕参数尘埃落定。本文复盘了一下 iPhone 12 的屏幕参数到底是如何变化的,对于普通用户在 iPhone 12 上使用 app 又有什么影响。

苹果原生支持使用 IPv6,并且支持 IPv6 和 IPv4 混合使用(一个 App 内)或者仅使用 IPv6 网络,文章解释一下使用 IPv6 以后带来性能提升的原因。

这是一篇关于 Android 最新的导航栏组件和 DeepLink。

从 Chrome 87 开始,浏览器原生提供 cookie 操作的 API,再也不用字符串拼凑了。

新增特性包括:images 自动优化,内置国际化路由,真实用户的性能测量Analytics,React 17 支持等等~

大前端快报 No.22

CRA 是一个比较流行的 React 工程生成的脚手架,这次发布带来了 React 17、ESLint 7、TypeScript 4 等支持,还有更快的 refresh 性能。

QUIC 和 HTTP/3 是在 IETF 中开发了将近 4 年的开放式标准。目前,该文档系列已被放到 IETF Last Call 中,这是一个重要的里程碑。

这是一个 tab 级别的锁,可以做到多个 tab 应用运行时公共资源竞争问题。

Assembly 2020 上的一个 1024 字节 DEMO 挑战的获胜作品,使用 1021 个字节达到了很棒的效果。

MDN 近期更新了编辑策略,关注点主要在:内容质量和编辑节奏,同时也非常需要热情的人参与贡献。

SharedPreferences 的官方替代品。

大前端快报 No.21

随着 Linux 版本的发布,Edge 基本算是全平台覆盖了,不过目前 Edge 同步功能还比较弱,可以稍微期待下。

此前是 RC 版本,现在正式版本已发布。v17 版本比较不一样,这个版本主要聚焦使 React 升级更加顺滑容易。

一大波更新,默认内置 npm 7,支持 QUIC,V8 升级到 8.6,由此可以享受 V8 的新特性如 Promise.any、String.prototype.replaceAll 等。不过不是 LTS 版本,所以生产还是等明年的 16 吧。

介绍了Android 车载应用程序库的相关内容。

Android studio 4.1 稳定版本已经发布,这篇文章介绍了Android studio 4.1的功能与特性。

为新手准备的手写解析器教程,车速较快,不能眨眼。

图像通常是拖慢应用速度的最大因素,文章讲解了如何使用 SVG 做为 Placeholder,解决用户对前端展示中图片的从模糊到清楚的展示方案,包括视觉原理,SVG 生成与使用方法。

Web 很久以来都是直接或者间接依赖传统的密码认证,随着 Web 能力的扩充,已经可以很好地支持多因子认证了。

一直以来 :not() 里只支持一个简单选择器,随着 :is() 支持复杂选择器,通过 :not(:is()) 有望为 :not() 增加复杂选择器的支持。

Web Vitals 核心指标是三个未来影响 SEO 重要的指标,这篇文章较为详细地介绍了来龙去脉和一些优化手段。

大前端快报 No.20

iOS 13后使用系统framework进行性能收集

字节自研了一款基于内存快照技术并且可应用于生产环境中的 OOM 归因方案——线上 Memory Graph。基于此方案,3 个月内头条抖音 OOM 崩溃率下降 50%+。

Ionic 是一个比较著名跨端框架,19 年简陋地支持了 Vue 2,近期算是全面支持了 Vue,可以使用所有的 Vue 3 的特性,凭借 Vue 的生态,应该会有个不错的发展。

本次是一个 minor 版本,比较重要是增加了 fs.rm,相比 fs.rmdir 这个是一个更接近 *nix 系统 rm 命令的 API。

PRPL 是 Push、Render、Pre-cache、Lazy-load 的简称,这些不是什么新鲜的事物,通过本文可以形成一些更高维度的思维模式,而不是点状的。

大前端快报 No.19

支持Windows的Flutter Alpha版本已经发布。

通过本文你将会了解到 Universal Links 基本概念,并且深入了解今年 Apple 对 Universal Links 的改进及优化

苹果 10 月份的 Apple Event "Hi, Speed" 就将开幕。和 9 月份的 Apple Event 一样,这次活动是以线上的形式呈现,背景是 Apple Park。而各路爆料大神也基本上把这次发布会扒了个底朝天,我们就来看看,这次发布会可能会带来哪些新产品,而又会错过哪些新产品。

iOS 14 官方建议使用 PHPicker 来替代原有的 API 进行图片选择,本文介绍对比了 PHPicker 的优缺点以及与其他图片选择框架进行对比。

HTTP/3是只跑在 QUIC 上的最新版本的 HTTP,Chrome 正在推出对 IETF QUIC 支持

2020年值得关注的 20 个 JavaScript 和 Node.js 开发者

主要三个特性:允许管理一个项目里的多个包;自动安装 peerDependencies;新的 package-lock.json 格式,同时支持 yarn.lock。

大前端快报 No.18

一篇追踪 ES2021 实际的和可能潜在的新增特性 blog,文章内容会持续的补充更新。

自 Webpack 4 发布已经两年了,新版本最重要的特性就是缓存机制的改变,以及更强大的 Tree-Shaking。

支持 iOS 14 和 Android 11,更加丰富的按钮样式,新的国际化和本地化支持,Navigator 2.0。

Git 第一次提交的源代码分析及带来的启示。

WorkManager 是一个 Android Jetpack 扩展库,它可以让您轻松规划那些可延后、异步但又需要可靠运行的任务。对于绝大部分后台执行任务来说,使用 WorkManager 是目前 Android 平台上的最佳实践。

直觉来说,iOS App 如果进入后台了能做的东西就非常少了,碰到「后台检测手机摇一摇」类需求时如何实现呢?作者给出了完整的研究和实现过程。

大前端快报 No.17

原定 20 年 12 月不再接受使用 UIWebView 的 APP 提交审核,该 deadline 被延后了,具体时间另行通知。

本方案主要用于解决启动图无法渲染、不更新等异常问题,能够让应用自动恢复正常的启动图,从用户角度来说最坏的情况是首次启动时展示了异常的启动图,但下次冷启时即可展示正常的启动图了,保证了用户体验。

14隐私权限进一步收紧之后,苹果要求我们使用 PHPicker 来作为相册选择器。本文介绍了集成的整体流程,以及使用上的一些坑点。

本次更新新增了不少利于开发调试的功能,比如媒体面板、按 DOM 节点截图、新的安全策略 COEP / COOP 信息展示等。

有时需要显示相对时间,比如"5分钟前"、"2天前"等等。一般使用外部库来实现,其实浏览器原生的 Intl.RelativeTimeFormat API 就可以做到。

这个系统分析器是一个用于在实际应用程序中跟踪、调试和分析如何创建和修改内联缓存和映射的统一 Web 界面。

众所周知,Shadow DOM 是 Web Components 一个很重要的部分,但是构建 Shadow DOM 一直都是通过 JavaScript(命令式),从 Chrome 88 开始,提供了声明式的方式。

大前端快报 No.16

一个 Google 工程师给 Next.js 弄了个提案,简单说就是目前 Webpack loader 之前都是割裂的,比如 babel-loader 和 eslint-loader,如果能共享之间的 AST 树,除了性能,还能解锁很多新的姿势。

Chrome 87 会带来两个新的 CSS 属性,对文本装饰线的粗细和偏移量可以做更多的定制了。

可能很少人会用 4K 持续录制半个多小时,但是在 Android 11 上你可以这么做了,当然这还要相机支持。

Paging 3.0 是一个完全使用 Kotlin 协程重写的库,相对于 Paging 2.0 提供了更灵活的数据转换操作。

从 1.2.0-alpha02 版本开始,Jetpack RecyclerView 提供了一个新的 API,可以让 Adapter 在数据加载完成之前阻塞布局行为,从而避免丢失滚动位置信息。

多角度分析 WebView 秒开是如何做到的。

大前端快报 No.15

继 Swift 可以写服务端代码后,现在又可以写 Windows 桌面代码了,看起来可以成为事实上的通用语言了。

借着 Java 15 的发布时机,我们看下 Java 目前的状态。

除了日常更新,这个版本比较重要的是去除了代码里的种族歧视以及一些不友好的语言。

像不同硬件对 CPU 指令集的支持不同一样,不同硬件对不同的纹理压缩格式支持也是不一样的,Google 提供了类似于选择提供 SO 库的方式对不同的机器提供不同的纹理压缩格式。

苹果在发布 Xcode 12 正式版后仅一天的时间,就发布了 Xcode 12.2 Beta 1。印象中这应该是第一次,不仅是两个版本间隔时间短,而且直接跳过了 12.1。本文解读了 Xcode 12.2 Beta 1 有什么新东西,以及解决了哪些 BUG。

PDF 表单填充这个功能简直是签合同的神器,目前需要升级 Firefox 到 81+ 且使用自带的 PDF 阅读器才可以。

本文介绍了 CSS perspective 的一些基础知识,用了大量例子进行效果展示。

尽管 React 17 没有新特性,但是提供了一个新的 JSX 转换器,这除了可以减少最终包体积,还可以避免无聊的文件开头的 import React。

随着 React 17 新的 JSX 转换器出来,已经不需要在文件开头明显引入 React 了,而且 Dan 也表示,未来这种用法会被干掉。

大前端快报 No.14

本次新版本的更新包括:性能的改进,更小的 bundle 体积,对 Typescript 更好地支持,用于处理大规模用例的全新 API,以及为未来的长期迭代夯实基础。

官方命令行工具 gh 终于从 beta 升级到了 1.0,不过 CLI 党不要妄想能完成所有操作,该打开网页还是得打开。

这个 PR 虽然是一个通用的功能,但是这些提示是硬编码到代码里的,目前也只有 Moment.js 会有提示。

这个是 Snowpack 的一部分,不过可以单独拿出来使用,ESM 的优势不必多说,esinstall 使用比较巧妙的方式让我们提前进入全面 ESM 时代。

使用 React 钩子而不是类的 6 个理由。

MXFlutter 是一套基于 JavaScript 的 Flutter 框架,可以用极其类似 Dart 的开发方式,通过编写 JavaScript 代码,来开发 Flutter 应用,或者使用 mxjsbuilder 编译器,把现有 Flutter 工程编译为JS,运行在 mxflutter 之上。

除了性能隐私方面看不到的特性,还有一波前端相关新特性的支持,重点关注下 CSS 和 Web Inspector。

13 年间 iPhone 的屏幕尺寸是怎样一步步进化到此的?基于软硬一体的设计,屏幕物理尺寸的变化背后包含着怎样的进化规律?这些变化对我们朝夕相处的手机 App 又产生了什么影响?

本文其实是 v2ex 上面的一个帖子: "iOS 开发有什么国人写的比较好的书籍推荐?"。里面的内容大多来源于 lujie2012 以及其他人的一些回答,回答的内容已经不仅仅是推介书了,还包含了很多关于 iOS 学习上的问题。虽然里面个别回答或观点我并不是完全认同,但还是希望对有意进步的同学有一点点帮助。

了解下调试 Android GPU 状态的工具吧!

大前端快报 No.13

Android 11 提供了处理 URI 分享、增量权限申请等等一些列新的隐私特性,看一下怎么适配吧!

看一下 Jetpack Compose 声明式 UI 是开发分页列表和传统 RecyclerView 的不同吧!

从 Chrome 85 开始 iOS 直接使用 Chrome 桌面浏览器时会额外增加 CriOS/,目的是让开发者可以区分 Chrome 和 Safari 并针对性地优化。

本篇从业务和技术两个角度,列出了 App Clips 真正落地可能会遇到的问题,度量的角度可以作为我们实际业务落地过程中的参考。

文中不仅详细介绍了 Flutter 的槽点和优势,还分析了 Flutter 世界中一些有意思的设定 ,比如 Widget 和 Element 的关系,组成 Dart 层渲染闭环的其他元素等。

本文调研了在 iOS 14 Beta 系统中获取 IDFA(广告符)的流程,并暴露了一个 Beta 系统的绕过权限获取广告符的方法(不知道能不能活到正式版)。

从一个优秀开源项目的诞生,到用开源项目赚到数百万美元的历程。

这漫天星空,就像。。。。。。就像浏览器的窗口!!

这个提案基于过去提案的所有元素,但和此前的两版又有不同,目前处于 TC39 第 2 阶段,这个月将进行更深入的讨论。

官方声称 Moment.js 是远古时期的产物,也承认了被人诟病的体积和可变的(mutable)的问题,现在正式宣布进入维护期,虽然没说不维护,但是基本判了死刑,官方也给了些替选方案。

大前端快报 No.12

针对目前 Node HTTP API (req, res, next) => {} 这种恶心的形式,Svelte 作者发表了些他对于下一代接口设计的看法。

众所周知,刚刚开源的「鸿蒙 2.0」以 JavaScript 作为 IoT 应用开发的框架语言。这标志着继 SpaceX 上天之后,JavaScript 再一次蹭到了新闻联播级的热点。

2020 年版本的 Todo APP, 用 Vue 3 的 Compitision API 和 React Hooks 构建了同样的 APP,分析两个框架在数据绑定、更新,事件触发,参数传递等各个细节上的区别,值得一看。

这个不是什么新特性,只是发现使用这个人很少。

比大话设计模式还要有意思的设计模式讲解。

结合实际的业务场景,图文 + 代码 生动介绍设计模式如何在项目的使用。

Android Go 是针对低端设备量身订作的Android 系统,最初与 Android Oreo 一同推出,适用于 1GB 或更低内存的设备。所以现在 2G 也被认为是低端设备了?

Jetpack 提供了新的 DataStorage API 用于替换 SharedPreferences 提供更好的使用体验。

大前端快报 No.11

在 WWDC20 中,苹果曾宣布在 iOS 14、iPadOS 14 和 Apple tvOS 14 上,开发者需要征得用户的许可,才能在其他公司所拥有的 App 和网站上跟踪用户,或访问其设备的广告标识符。而根据苹果最新发布消息显示,为了让开发者有时间进行必要的更改,App 需要获得跟踪用户许可的要求将从明年年初开始实行。

关键字是 以人为本、灵活控制与隐私安全,优化了开发者体验。

值得关注的一些变化:添加 randomInt 函数,添加 idleTime 和 event loop util,更简单、更快的可读异步迭代器(async iterator)等。

Xcode12又带来一些新特性,Assets已经支持SVG资源了,并且和我们熟悉的PDF格式的工作方式相同。

在 Android 11,Android Runtime 新增了一个叫 Structural Class Redefinition 的扩展到 JVMTI API,通过这个 API 可以增强早期 AS 提供的 Apply Changes 能力。

尤雨溪在 ReadME Project 自述开源 Vue 和建立一个 vuejs 社区的旅程,最后还分享了一些工作和生活平衡的思考。

这是一个 TypeScript 的 MySQL 插件,通过模板字符串方式写 SQL 代码,并且可以达到自动补全的目的。

随着 Chrome 85 迎来了新的网络图片格式 AVIF,体积更小且质量更高,这篇文章有详细的测评数据值得看下。

只需要告诉它 Web 服务启动方式,它会自动启动并爬取完成预渲染,它不关心你使用的 Web 框架,Emmm...小编有个大胆的想法!

文章比较基础,讲的是 Node 服务部署方式的演进,如何达到弹性自愈,甚至一句话就可以总结:npm start -> nodemon -> pm2 -> systemd -> docker -> swarm -> k8s 。

大前端快报 No.10

这是一个外国工程师的一些职场感悟,虽然不能代表什么,但是不妨碍我们去了解下其工作和思考方式。

Android 11 提供的 WindowInsets API 可以让 APP 在键盘打开和关闭使用无缝动画。

扫盲篇:天天 pod install、pod update,其实你知道的只是 Cocoapods 的冰山一角。

随着即将到来的 Chrome 86,主流现代浏览器会正式支持 ::marker,有了它,终于可以自定义列表样式了!

在即将要发布的 TS 4.1 里有个 PR,它带来了让几乎所有 TS 用户都会激动的模板字符串类型,很多人脑洞大开基于这个做了很多非常有意思的尝试,可谓开启了元编程的大门。

UI 开发效率的提升离不开三个重要因素: 编程语言、集成开发环境 (IDE) 以及用户界面 (UI) 框架。Jetpack Compose 的目的就是为了让您 (我们也是!) 能在构建 UI 上更加高效!

创建一个 3D 模型就像写一行 HTML 一样简单,v1.1包含了在 web 上的增强现实(AR)的内置支持,改进了速度和逼真度等。

大前端快报 No.9

在 Android 11 上,我们引入了两个新工具 —— Data Access Audit 和 Process Exit Reasons

全新语言特性和更多改进,包含新的语言特性、改进的编译器和工具。

Apple 的工程师将告诉我们如何改造现有的 Objective-C 框架,使其能够更符合 Swift 的使用体验。

Crash捕获原理是什么?如何看懂Crash日志?Crash分析方法有什么?深入了解后可以帮助我们快速定位崩溃问题。

从 PPT 到 Keynote,到 Google Slides,再到基于网页的 reveal.js,你见过直接在命令行终端里玩的吗?

  • useSWR: 一个数据请求的 React Hook 库,性能和用户体验之间的完美权衡 https://bit.ly/2G6obvl

SWR 的名字来自 stale-while-revalidate,是一种在前端领域越来越流行的缓存策略。

继 WeakMap、WeakSet 之后,JS 内存管理武器库又引入了一个装填非银弹的新成员 - WeakRef,没有别的,就先备着。

当今 CSS-in-JS 方案或者库已经很多了,但是说实话大多都带有很多缺陷,这款有很多特性确实能让人眼前一亮,目前还在 Beta 阶段,可以先关注起来。

Recoil 是 Facebook 出的数据流管理方案,基于 Immutable 的数据流思路,有一定思考的价值。

大前端快报 No.8

Midway Serverless 发布有一段时间了,在发布之前阿里内部已经用的比较广泛了,与其说这是一个访谈,不如说这是一个 Q & A。

除了样式和动画,居然还提供了音效,全方位支持让你轻松打造酷酷的页面。

主要包括 Stack Upgrades,其他较多的新增特性和大量的 bug 修改以及一些性能优化,对 7.x.y 版本将不再支持。

Promise.any 跟 Promise.race 比较类似,区别在于其不会因为 reject 而提前结束。

这是一个关于的 WebRTC 的电子书,是由 WebRTC 实现者创作的,非常干。

基于 AV1 视频格式的现代图像格式,AVIF 具有比 WebP,JPEG,PNG 和 GIF 更好的压缩效果,并被设计以替代它们。

实时 HDR+ 和双重曝光控制

大前端快报 No.7

全新 Android Material 组件 (MDC-Android) 1.2.0 来了!此次发布新增了很多有意思的新功能、修复了很多问题,并改进了无障碍使用体验,让我们一起探索吧!

Android 11 对设备已安装应用列表增加了过滤功能,针对这一功能需要对 AGP 进行相应的升级。

我们知道 Svelte 号称没有运行时,所以在组件很小时是可以做到比 React 这类带运行时的库小的,但是如果组件很大呢?

传统 Webpack 构建时间复杂度是 O(n),而这个号称时间复杂度是 O(1),dev 冷启动可以达到 50ms 以内!

只需要最基本的前端知识和必要的开发环境,跟着生动有趣的教程重新认识下 WASM。

Prisma 是新一代的数据库工具集,ORM 框架,能够管理复杂的数据库构建和读写,拥有优异的开发体验,快速开发GraphQL、REST、gRRC 等服务,适用于任意语言。

主要针对 Flutter 从编译优化、混合开发增强、多维度的性能优化、Darkmode 自适应等功能增强等场景入手。

利用浏览器去解析 imports,在服务器端按需编译返回,完全跳过了打包这个概念,服务器随起随用。同时不仅有 Vue 文件支持,还搞定了热更新,而且热更新的速度不会随着模块增多而变慢。

大前端快报 No.6

Warning 多了居然会完爆 Xcode 内存占用,万恶的 Warning 到底干了什么天怒人怨的事情?

原来 Docker 不是 Linux 专属,macOS 上面也可以玩的飞起,来啊~ 快活啊~

号称比其他 JavaScript 打包程序快至少 100 倍(当然是在它定义的 benchmark 中)。

非常详细的介绍了前端监控平台中,前端 SDK 的细节实现。内容详细,整理到位。

TypeScript 4.0 现已正式发布,该版本没有重大的突破性变化。TypeScript 团队表示新版本继续使用与过去版本相似的版本控制模型,可将 4.0 视作 3.9 的延续升级版本。

Fragment 1.3.0-alpha8 重构了 Fragment 的实现,了解一下底层的实现吧!

Android 11 系统 Media 的具体更新和带来的新特性。

大前端快报 No.5

今年 11-30 微软内部应用会停止对 IE 11 的支持,明年 8-17 所有的应用和服务停止对 IE 11 的支持。

看描述是用 Rust 写的另一个 Node 端和浏览器端的包管理,目前项目刚刚开始,作者之一是前 NPM 团队成员。

AS 4.1 在 Memory Profiler 上提供了更强大的功能,看一下 Native Memory 有哪些更新吧。

�随着 Android Car 系统越来越流行,是时候了解一下目前 Android Car System 的情况了!

RN 在美团外卖的工程性实践。

事实上,这次版本更迭确实有“新特性” —— 替换了内部使用的启发式更新算法。只不过这个特性对开发者是无感知的。

分析使用 Redux 的场景,提出 SWR, react-query 这样的后端数据缓存的方案,来解释大部分的项目,不太需要 Redux 来进行数据管理。

大前端快报 No.4

Runtime 对象介绍最全的一篇文章,源码注释,为读懂 iOS 14 Runtime 优化打下基础。

解读 iOS14 是如何做到更小的类数据结构、更小的方法列表、标记指针的变化 这三项运行时优化。

  • 为什么你的 APP 在 Sketch 上看起来更好: 探索 Sketch 和 iOS 的渲染差异 http://163.lu/gZTss0

我们开发用的 UI 图基本都是由 Sketch 生成的。Sketch 在文字排版、阴影、渐变上和使用同样的数值开发实现效果会有差异。这篇文章介绍了如何抹平差异的方法,在视觉要求高的场景下可以完美实现视觉稿效果。

一起看下 Flutter 1.20 增加了哪些新功能。

Ktor 是基于 Kotlin 协程的网络库,可以 run on differrnt platforms。

不是我冒犯,包括我自己在内,如果满眼都是 React 和 Vue 之类的前端框架、库,那么可以说,对前端数据层几乎一无所知,就算把前端框架玩的贼溜,对前端架构的理解,也不过是井底蛙之王。

这是一段 CSS 的考古,从早期 HTML 被提出到 CSS 被实现经历了有 10 年之久,这期间充满了各种尝试,任何一种尝试如果成为如今的 CSS 的话或许整个 Web 会是另一个面貌。

顶级 await 可以直接使用了!

大前端快报 No.3

快手推出了 KOOM,作为首款检测和解决线上 OOM 的工具,可以了解它的实现思路。

Android 提供的新 Feature I/O prefetching,通过对 I/O 的优化进一步提升 APP 启动速度。

我们知道上个月 GitHub 把我们的代码打包放到了北极,除了代码其计划还有一个包含当今计算机基础的技术树作品集,这几天刚刚完稿。

在 Node.js 14.7.0 里,首次发布了类似 DOM 里的 EventTarget API,这篇文章记录了做这个初衷和遇到的一些挑战。

距离 v16 发布已经过去两年半,终于迎来了 v17,但是这次发布对用户来说并没有新特性,这次发布作为跳板为了 React 自身后续更平缓的升级。

早些时候 Chrome 针对 80+ 以上的版本进行 SameSite 策略灰度,简单说就是默认使用 Lax,目前已经全量更新。

对官方 SwiftUI 教程很好的补充说明,实操中体验从命令式到声明式界面开发方式的改变。

通过了解 WWDC20 关于 SwiftUI 的重大改变,真实感受到 SwiftUI 的核心优势。

大前端快报 No.2

进入 RC 意味着不会再有 Break Changes 了,4.0 带来了诸如可变元组类型、元组标记等重要特性。

这曾经是小编梦寐以求的功能,通过 gap 属性可以为 Flex 元素设置间隔,目前除了 Safari,现代浏览器都支持了。

从最常见的点击事件出发,了解事件传递再到事件响应整个过程。

上文事件响应是苹果利用 Runloop 实现众多功能的冰山一角,接下来我们揭开 Runloop 面纱,深入理解 Runloop,真正感知到 Runloop 时时刻刻在我们身边。

Android 4.0 新推出的 Build Analyzer 是 Build 分析利器,可以看一下使用介绍和心得。

R8 编译器可以给 APP 带来更高的压缩比,下面的文章介绍了 R8 的背景、工作流和使用上的 Tips。不过目前还在不断优化中,可以持续关注。

大前端快报 No.1

从计算机渲染原理到屏幕成像最后到渲染流水线,追本溯源,真正理解工作中碰到的卡顿、离屏渲染等本质原因。

剖析 CoreAnimation,让工作中轻松实现绚丽动画效果。

Android 11 beta 版以及发布,包含了大量的新特性,这里列举了较为重要的一些特性列表,快来看看有哪些我们可以使用和适配的地方吧!

Flutter 开发中如何快速的对一个组件进行预览呢?现成的工具供上。

目前 Node v14.x 上是通过 --harmony-top-level-await flag 启用 TLA,根据目前情况,已经去掉了这个 flag,也就是有望在下一次发版就可以默认享受 TLA。

Records 和 Tuples 提案目前处于 Stage 2,这为 JS 带来了原生的不可变数据结构,对 React 而言无疑是巨大福利,因为这之前我们大多需要依赖 Immutable.js。

@int64ago int64ago changed the title 大前端快报 No.1 - No.41 合辑 大前端快报 No.1 - No.44 合辑 Jan 13, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant