前端周刊 | Typora发布1.0版本并开始收费; Remix正式开源; Rust审核团队集体离职
新栏目《前端周刊》来啦!本刊每周日更新,主要内容包括前端趣闻、更新速递、开源新闻、工具推荐、文章推荐等。
一、前端趣闻
1. Typora 发布1.0正式版,并开始收费
Typora是一个比较流行的 Markdown 编辑器。根据官网显示,其正式推出 1.0 正式版,并开始正式收费。
目前采用买断制,价格为$14.99,最多可在 3 台设备上使用。
详见Typora官网:https://www.typora.io/
2. Rust 审核团队集体离职
11月23日,Rust 审核团队在 GitHub 的 PR(Pull Request)上宣布辞职且即刻生效,并表示这是“为了 Rust 核心团队只顾自己、不对其他人负责的抗议”。
团队成员 Andrew Gallant 在公告中写道,由于核心团队在组织结构层面的不负责任,他们一直无法按照社区对审核团队的期望和他们自己坚持的标准来执行 Rust 行为准则。对于在这种情况下选择离开,他们表达了对大家的歉意。但从治理 Rust 的角度来看,他们别无选择。因此 Rust 审核团队认为除了辞职和发表这份声明之外,已经没有其他办法了。
Rust 是 Mozilla 的一个新的编程语言,专注于安全,尤其是并发安全,支持函数式和命令式以及泛型等编程范式的多范式语言。由web语言的领军人物Brendan Eich(js之父),Dave Herman以及Mozilla公司的Graydon Hoare 合力开发。
Rust语言的特点:
高性能 - Rust 速度惊人且内存利用率极高。由于没有运行时和垃圾回收,它能够胜任对性能要求特别高的服务,可以在嵌入式设备上运行,还能轻松和其他语言集成。 可靠性 - Rust 丰富的类型系统和所有权模型保证了内存安全和线程安全,让您在编译期就能够消除各种各样的错误。 生产力 - Rust 拥有出色的文档、友好的编译器和清晰的错误提示信息, 还集成了一流的工具 —— 包管理器和构建工具, 智能地自动补全和类型检验的多编辑器支持, 以及自动格式化代码等等。
Rust 语言可以用于开发:
传统命令行程序 - Rust 编译器可以直接生成目标可执行程序,不需要任何解释程序。 Web 应用 - Rust 可以被编译成 WebAssembly,WebAssembly 是一种 JavaScript 的高效替代品。 网络服务器 - Rust 用极低的资源消耗做到安全高效,且具备很强的大规模并发处理能力,十分适合开发普通或极端的服务器程序。 嵌入式设备 - Rust 同时具有JavaScript 一般的高效开发语法和 C 语言的执行效率,支持底层平台的开发。
详见Rust GIthub地址:https://github.com/rust-lang/team/pull/671
3. Next.js 开发商完成 1.5 亿美金融资
本周,Next.js 框架背后的开发商 Vercel 完成 1.5 亿美金 D 轮融资,估值已达 25 亿美金。
Next.js 是一个用于服务器渲染的通用 JavaScript Web 应用程序的小型框架,该框架基于React、Webpack 和 Babel 构建,为该网站提供了强大的支持。
Next.js 的 npm 安装量已达到每周 200 万次,自 2020 年 4 月以来其网络流量增长了 700%,提供了超过 240 亿个请求。如今 Next.js 的个人贡献者的数量也翻了一番,达到 1800 人。
详见Vercel官网:https://vercel.com/blog/vercel-funding-series-d-and-valuation
二、更新速递
1. React Redux 现在处于V8.0 beta 阶段
React Redux V8.0 的主要变化包括:
代码库转换为 TypeScript,因此不再需要安装 @types/react-redux; 使用 React 的新API useSyncExternalStore 来兼容 React 18; 删除了很少使用的 API; 使用现代化的构建输出。
详见React Redux GitHub地址:https://github.com/reduxjs/react-redux/releases/tag/v8.0.0-beta.0
2. Prettier v2.5 发布:支持 TypeScript 4.5
Prettier 发布 2.5 版本,此版本增加了对TypeScript 4.5的新语法和MDX v2注释语法的支持。
Prettier 是一个“有主见”的代码格式化工具,它通过解析代码并使用规则重新打印它来强制执行一致的样式,能够使输出代码保持风格一致。其支持列表如下:
JavaScript JSX Flow TypeScript CSS、LESS 和 SCSS JSON GraphQL
详见Prettier官网:https://prettier.io/blog/2021/11/25/2.5.0.html
3. ESlint v8.3.0 发布
ESlint 发布 v8.3.0 版本。ESLint 是一个语法规则和代码风格的检查工具,可以用来保证写出语法正确、风格统一的代码。ESLint不仅可以检测JS,还支持JSX和Vue,它的高可扩展性让它能够支持更多的项目。
详见 ESLint GItHub地址:https://github.com/eslint/eslint/releases/tag/v8.3.0
三、开源前线
1. Remix 框架正式开源
Remix 是一个由 React Router 开发团队所开发的基于 React 和 Node 的全栈框架,如今 Remix 关闭付费订阅模式,正式开源并将源代码托管至GitHub平台。
Remix 作为一个框架,具有以下功能特性:
文件系统路由 路由布局嵌套 自动拆分代码 数据驱动的元标签 内置数据加载 零配置构建 React Refresh
详见Remix官网:https://remix.run/
四、工具推荐
1. BetterViewer
BetterViewer是本周首推的工具,它是一个Chrome扩展,可以提供更好的图像查看体验。BetterViewer 旨在替代基于 Chrome 浏览器中内置的图像查看模式。
它支持以下功能:
放大/缩小/重置; 全屏展示; 向左旋转/向右旋转; 水平翻转/垂直翻转; 裁剪图像; 绘制; 下载图片; 上传图片; 颜色选择器; 图片详情; 更改背景颜色(暗/亮/模糊); 打印图像; 从图像中提取文本; 在 Photopea 中编辑。
我们只需要在Chrome 浏览器的扩展商店搜索 BetterViewer,并添加到浏览器即可。使用时,只需在页面右键点击图片,选择“在新标签页中打开图片”即可。
BetterViewer 扩展程序地址:https://chrome.google.com/webstore/detail/betterviewer/llcpfkbjgkpmapiidpnohffjmmnhpmpb
2. Debug CSS
Debug CSS也是一个Chrome浏览器插件,从名字可以知道,这是一个帮助调试CSS的插件。他可以显示出页面元素的轮播,按住Ctrl,并将鼠标悬浮在元素上,即可查看其信息:
Debug CSS 扩展程序安装地址:https://chrome.google.com/webstore/detail/debug-css/igiofjnckcagmjgdoaakafngegecjnkj
3. JSON Viewer Pro
JSON Viewer Pro也是一个Chrome扩展程序,主要用于可视化JSON文件。其核心功能包括:
支持将JSON数据进行格式化,并使用属性或者图表进行展示; 使用面包屑深入遍历 JSON 属性; 在输入区写入自定义 JSON; 导入本地 JSON 文件; 使用上下文菜单下载 JSON 文件; 网址过滤器; 改变主题; 自定义 CSS ; 复制属性和值;
输入界面如下:
JSON Viewer Pro 扩展程度安装地址:https://chrome.google.com/webstore/detail/json-viewer-pro/eifflpmocdbdmepbjaopkkhbfmdgijcc/related
4. Window Resizer
Window Resizer是一个Chrome 浏览器扩展程序。主要用来调整浏览器窗口的大小以模拟各种屏幕分辨率。
Window Resizer 扩展程序安装地址:https://chrome.google.com/webstore/detail/window-resizer/kkelicaakdanhinjdeammmilcgefonfh/related
五、文章推荐
1. 雅虎前端优化的35条军规
本文主要介绍了雅虎关于性能优化的35条军规,虽然这些“军规”已经发布了很多年,但是多数仍然对我们的前端性能优化有一定的指导意义,为我们提供了一些性能优化方向。
文章地址:雅虎前端优化的35条军规
2. 程序员面试必备软技能!
在准备面试时,除了基本的业务知识,还有很多需要注意的点。本文主要介绍了面试前准备、技术简历制作、面试注意事项、HR面注意事项等。这些软技能是每一个程序员都需要掌握的。
文章地址:程序员面试必备软技能!
3. 实现九宫格布局,你能想到多少种方法?
使用CSS实现九宫格是一个很常见的需求,并且近两年很多大厂的面试中都出现过这个题目。本文主要介绍了实现九宫格布局常见的五种方式。
文章地址:实现九宫格布局,你能想到多少种方法?
4. 使用 React Hooks 时要避免的6个错误!
React Hooks相对于类组件确实好用了很多,但是使用时确实有很多坑,有很多需要注意的点。本文主要介绍了在使用React Hooks常见的6个错误,以及如何去避免这些问题。
文章地址:使用 React Hooks 时要避免的6个错误!
5. 如何实现一个深浅拷贝?
深、浅拷贝是经常在前端面试中问到的问题,主要考察对数据类型的理解。本文就主要介绍了深浅拷贝的一些常见的实现方式,以及lodash中深拷贝实现的源码。
文章地址:如何实现一个深浅拷贝?