上周有啥好玩的 2/10

2022-04-23 17:18 | (license)

Article

  • 如何把前端项目写成一座屎山？

    现在的前端项目越来越大，复杂度也随之提升，因此需要一些好的架构设计和设计模式辅助，或者像文中所述这样，换个角度来，看看如何做才会毁了一个项目。

  • 超越库和框架的技术创新

    框架之所以为框架，在于其把很多底层逻辑封装好了，只暴露了部分 API 供其他开发者使用，如今大多数开发者使用各种开源库和框架都是知其然而不知其所以然的，很少人会对其底层的设计模式等“程序员内功”了解的。看看本文或许可以让你有点新的想法（大家一起努力不成为一名 API 工程师。

  • 现代 CSS 解决方案：CSS 数学函数之 calc

    CSS 中的 calc 函数大家应该用得都挺多的了，看看还能怎么玩。

  • Web 中的“选区”和“光标”

    网页中的 “选区” 和 “光标” ，这两个是浏览器实现的 Web API，要做 Web 编辑器需求的话，了解这两个概念是基础。

  • 2022，前端工具链十年盘点

    前端日新月异，每天各种轮子满天飞，如果了解一下前端历史，从历史的角度来看的话，可以有一个很好的视角了解现在的前端正处于怎样的一个阶段中。

  • The Front-End Developer's Guide to the Terminal

    给前端开发者的终端使用教程，介绍了从安装到日常使用的一些进阶小技巧。终端也是开发者天天打交道的工具了，熟悉一下可以让你代码打得更 6 。笔者表示第一次配置好了 zsh 和 oh my zsh 这些 shell 环境之后，才发现原来在终端打代码也可以那么爽~

  • What is 'bad design'? 10 examples & how to avoid them

    文章列举了 10 个例子来说明不好的设计是怎样的并给出了避免这些错误的方法。提升代码水平是为了产品少出现 bug ，但前端工程师在此之外也需要了解一下用户体验相关的知识。

  • Picture perfect images with the modern <img> element

    一篇深入浅出介绍使用 <img> 元素的好文章。文章介绍了网页中的图片对性能的影响，以及如何使用预加载、懒加载、响应式图片等方法来优化网页的性能。

  • Explain the First 10 Lines of Twitter’s Source Code to Me

    作为前端工程师，平常浏览网页时你会留意网页的 html 结构吗？文章介绍了推特页面的前 10 行代码的意义。现代前端开发中，还有多少人会留意 html 中 head 标签里面的内容呢，赶紧补习一下！

  • 4 reasons to avoid using npm link

    文章介绍了如何使用 npm link 调试本地 npm 包，并给出了 4 个其不好的原因（还推销了一下自己的写的工具。笔者最近在调试本地 npm 包的时候也会经常用 npm link 命令，感觉还是挺好用的，日常调试也够用。

Found

  • Museum of Endangered Sounds

    一个类似互联网档案的博物馆网站，展示了一些已经存在记忆里的音效。

  • Explore DOM Events

    用可视化的方式展示 DOM 事件流程，可以清晰地看到用不同的参数定义的 DOM 事件在每一个阶段是怎么进行的。

Tool

  • Look Scanned

    一个工具，可以让 PDF 看起来像是被复印过一样，emmm。。。有趣

  • Mailwind

    使用 Tailwind CSS 来设计 HTML 邮件。

  • node-svg2img

    一个高性能的 SVG 转 PNG/JPG Nodejs 库

  • type-fest

    一个 TypeScript 类型的工具集，包含了很多非常有用的类型定义，也可以看看源码学习一下写这些类型的思路。

  • wangEditor

    一个国产的开源 Web 富文本编辑器，最近更新了 V5 版本，基于 Slate 内核进行二次开发。