本技术日志,每周定期分享,欢迎关注、转发。

Temporal,JavaScript 中处理日期和时间的未来 API

TC39 正在为 ECMAScript/JS 设计现代日期/时间 API 的提案。

https://blogs.igalia.com/compilers/2020/06/23/dates-and-times-in-javascript/

Chrome 新功能:“CSS 概览”Tab

这是一项新的实验功能,它可以提供网站上 CSS 的概览,包括颜色、字体、媒体查询,以及未使用的声明等。

https://css-tricks.com/new-in-chrome-css-overview/

Firefox 78 启用了 rel="preload" 的链接支持

https://twitter.com/mozdevnet/status/1280149655473487873

VS Code 新版本将带来新的 JavaScript 调试器

https://code.visualstudio.com/updates/v1_47#_new-javascript-debugger

ESLint 7.4.0 发布

https://eslint.org/blog/2020/07/eslint-v7.4.0-released

文章和教程

免费的 Next.js 学习课程(视频)

https://masteringnextjs.com/

用 Tauri 和 Vue.js 创建小型桌面应用程序

Tauri 是一个工具包(内置 Rust),用于构建跨平台、JavaScript 和 CSS 驱动的桌面应用。

https://www.smashingmagazine.com/2020/07/tiny-desktop-apps-tauri-vuejs/

在 React 中获取数据的 4 种方法

https://www.bitnative.com/2020/07/06/four-ways-to-fetch-data-in-react/

黑暗模式完整指南

https://css-tricks.com/a-complete-guide-to-dark-mode-on-the-web/

防抖讲解:如何让你的代码等待用户输入

https://www.freecodecamp.org/news/debounce-explained-how-to-make-your-javascript-wait-for-your-user-to-finish-typing-2/

Canvas 中的缓动动画

https://css-tricks.com/easing-animations-in-canvas/?utm_campaign=CSS%20Animation%20Weekly&utm_medium=email&utm_source=Revue%20newsletter

CSS 过渡简介

https://nelsonmichael.dev/introduction-to-css-transitions-ckc396nae003u5es1097h5rr1

Array.flat() 扁平化数组

https://www.samanthaming.com/tidbits/71-how-to-flatten-array-using-array-flat/

光与影

一堆丰富的例子,指导我们如何处理光线强度和角度。

https://ciechanow.ski/lights-and-shadows/?utm_campaign=CSS%20Animation%20Weekly&utm_medium=email&utm_source=Revue%20newsletter

实用工具

SnipperApp

macOS 原生应用,用于代码片段管理。轻量、高亮语法、支持 Markdown。

https://snipper.app/

shareon

用于境外互联网环境的,一款简单时尚的分享按钮组件。

https://shareon.js.org/

Financial

一款零依赖的财务计算库,可提供未来值、还款、利率等功能的计算。

https://github.com/lmammino/financial#readme

useWebAnimations

灵活的 Web Animations API 的 React Hook 库。

https://github.com/wellyshen/use-web-animations

browserless

一个企业级无头浏览器平台,拥有强大的浏览器自动化功能。

https://www.browserless.io/

Asayer

一个可以收集和分析 Web 前端错误,监控性能的平台。

https://asayer.io/

eslint-plugin-import

ESLint 的插件,支持 ES2015+ import/export 语法,可以避免文件路径和导入模块名的拼写错误。

https://github.com/benmosher/eslint-plugin-import

Snack

一个可以在浏览器中编写 React Native 项目的在线 IDE,免去下载和安装依赖包的烦恼。

https://snack.expo.io/

Keyframes

一个简单的可视化 CSS 动画创建器。

https://keyframes.app/

内容来源

关注公众号,关注前端技术

赵不寒的网络日记