《前端技术观察》是由字节跳动IES前端团队收集、整理、推荐的业界高品质前端资源合集,主要分为以下几个板块:
《前端技术观察》的目的是让大家:
How to Monitor Your Web Page's Total Memory Usage with performance.measureMemory()
学习如何在生产环境中检测性能退化
https://frontendfoc.us/link/86774/web
Ten Security Tips for Frontend Developers
针对CSP, XSS等前端漏洞的检测和修复方法
https://frontendfoc.us/link/86785/web
Reminder: Bootstrap 5 Is Dropping Support for Internet Explorer
一个时代终将过去
https://frontendfoc.us/link/86798/web
midori: A Library for Animated Image Backgrounds
基于three.js, 提供了非常丰富的效果选项
https://frontendfoc.us/link/86803/web
Writing an 'Emulator' in JavaScript (and Interfacing with Multiple UIs)
实现了一个Chip-8语言解释器,对理解计算机体系结构很有帮助
https://javascriptweekly.com/link/87015/web
Profiling React.js Performance
深入了解React Profiler API和新的Interaction Tracing API
https://javascriptweekly.com/link/87016/web
Announcing CodePen Support for Flutter
Flutter代码预览/分享更便捷
https://mobiledevweekly.com/link/86928/web
Why Do Some HTML Elements Become Deprecated?
深入讨论一些HTML元素废弃的影响原因
https://css-tricks.com/why-do-some-html-elements-become-deprecated/
How Stack Overflow Built Its New 'Dark Mode'
对于大型网站,Dark Mode不只是切换一些CSS颜色,看看Stack Overflow在这个过程中做了什么
https://stackoverflow.blog/2020/03/31/building-dark-mode-on-stack-overflow/
Extending the Limits of CSS
CSS历史回顾和未来展望
https://www.welcometothejungle.com/en/articles/btc-css-limits
Rendering Charts with OffscreenCanvas
通过Web Worker高性能渲染图表
https://blog.scottlogic.com/2020/03/19/offscreen-canvas.html
Getting JavaScript to Talk to CSS and Sass
利用CSS varibles和getComputedStyle,实现JS和CSS之间的通信.
https://css-tricks.com/getting-javascript-to-talk-to-css-and-sass/
Node's Release Schedule is Changing (Though Only A Little)
v10支持延长,v12延期发布
https://nodejs.org/en/blog/announcements/adjusted-release-schedule-covid/
Node EventLoop
官方文档对事件循环的介绍
https://github.com/nodejs/node/blob/v6.x/doc/topics/event-loop-timers-and-nexttick.md
Node.js in a Kubernetes world
关于K8S, 7个需要知道的点
https://developer.ibm.com/articles/nodejs-kubernetes-basics/
Time Travel Debugger
实时运行测试,并在内部代码旁显示各种结果
https://wallabyjs.com/docs/intro/time-travel-debugger.html?utm_source=cooperpress&utm_campaign=javascript&utm_content=javascript
You might not need switch in JavaScript
借鉴py的dict,字典代替switch
https://www.valentinog.com/blog/switch/
Syntax highlighting for the Web
成熟的Web语法高亮库
https://highlightjs.org/
Native cross-platform Web Workers. Works in published npm modules.
兼容browser、node的webworker
https://github.com/developit/web-worker
A simple terminal UI for npm commands
项目npm依赖和scripts等的可视化管理,cli工具
https://github.com/jesseduffield/lazynpm
Write code and stay healthy
休息时间管理。定时灰掉编辑器字体,键盘无操作一段时间后恢复
https://github.com/schneefux/vscode-winddown
Hotkey binding
键盘快捷键绑定
https://github.com/github/hotkey