湖中剑 前端周刊 #7 | 2021-09-06

332 阅读3分钟

周刊收集包括前端(但不限于前端)的文章、新闻、开源项目、工具等等,每周一更新。

📰 News

Electron 14.0.0 发布

Electron 14.0.0 现已发布,此次带来了诸多更新,同时终止了对 Electron 11.xy 的支持。

此更新带来了 Chromium 93, Node.js 14.17, and V8 9.3。

github.com/electron/el…

github.dev

近日 Github 新出了一个功能,用户可以通过将 url 中的 「.com 替换为 .dev」 来直接打开在线版的 vscode 编辑器。

mp.weixin.qq.com/s/fRdEkLvxN…

📖 文章

精读《捕获所有异步 error》

mp.weixin.qq.com/s/mgSJHgp-R…

面向前端开发人员的交互式学习工具

听说通过玩游戏的方式可以学习得更好。

这里收集了一些代码工具和游戏帮助你学习CSS、JavaScript、SQL、React、Vim、正则表达式、Jamstack等等。

www.smashingmagazine.com/2021/09/int…

大概几集下饭剧时间就能懂的VUE3原理

mp.weixin.qq.com/s/fsyqkj5Fh…

学习 Webpack5 之路(优化篇)

本篇将从优化开发体验、加快编译速度、减小打包体积、加快加载速度 4 个角度出发,介绍如何对 webpack 项目进行优化。

mp.weixin.qq.com/s/pwynolH0p…

关于鉴权,看懂这篇就够了

mp.weixin.qq.com/s/-Yf6a58H7…

电商最小存货 - SKU 和 算法实现

目前电商平台的业务中,只要有商品,不可避免的会遇到SKU方面功能。这篇文章就从理论到实践,从商品创建到商品购买,手把手带你实现 SKU 相关的“核心算法”。

mp.weixin.qq.com/s/A2BLVnhas…

你不可能知道的骨架屏玩法🐶

juejin.cn/post/699467…

All in one:项目级 monorepo 策略最佳实践

segmentfault.com/a/119000003…

你的 Tree-Shaking 真的起作用了吗?

本文将探讨tree-shaking在当下的现状,以及研究为什么tree-shaking依旧举步维艰的原因,最终总结当下能提高tree-shaking效果的一些手段。

jishuin.proginn.com/p/763bfbd2d…

type-challenges

一个 TypeScript 类型挑战合集,提供了非常多题目,由易到难,边练边学。

tsch.js.org/

github.com/type-challe…

🛠 工具、软件

Mafs

数学可视化组件。

mafs.dev/

react-pdf-highlighter

react-pdf-highlighter是一个提供PDF文档注释功能的组件,基于PDF.js制作,支持文字和方框高亮。

在线示例:

agentcooper.github.io/react-pdf-h…

www.npmjs.com/package/rea…

JZZ.js

JZZ.js能够发送、接收和播放MIDI消息,简单来说就可以通过JZZ.js输出MIDI信号控制电子设备播放,或者接收MIDI信息播放音乐。

MIDI是编曲界最广泛的音乐标准格式,可以称为“计算机能理解的乐谱”。

github.com/jazz-soft/J…

smartcrop.js

smartcrop.js能够截取一个图片的最好、最主要的部分。

在线示例:

29a.ch/sandbox/201…

github.com/jwagner/sma…

Fiddly

把你项目的Readme.md变为一个好看、简单的HTML页面,部署在服务器上后就是一个好看的项目主页。

fiddly.netlify.app/

bundle

一个快速的npm包大小检查工具。

bundle.js.org/

TypeIt

强大的打字效果插件,但是商业使用还需要付费。

typeitjs.com/

FFCreator

一个基于node.js的高速短视频加工库

FFCreator是一个基于node.js的轻量、灵活的视频制作库。人人都能视频制作。

示例1示例2

特性

  • 完全基于node.js开发,非常易于使用,并且易于扩展和开发。
  • 依赖很少、易于安装,对机器配置要求较低。
  • 视频制作速度极快,一个 5 分钟的视频只需要 1-2 分钟。
  • 支持近百种场景炫酷过渡动画效果。
  • 支持图片、声音、视频剪辑、文本等元素。
  • 支持字幕组件、可以将字幕与语音 tts 结合合成音频新闻。
  • 支持简单(可扩展)的虚拟主播,您可以制作自己的虚拟主播。
  • 包含animate.css90%的动画效果,可以将 css 动画转换为视频。
  • FFCreatorLite版具有更快的合成速度,它也是一种不错的选择。

github.com/tnfe/FFCrea…

react-cosmos

react-cosmos是一个可用于UI组件开发、测试的沙盒环境。

在线demo:

reactcosmos.org/live-demo/

github.com/react-cosmo…


周刊首发于GitHub,欢迎订阅:

我的周刊