MDH • 前端情报

通知:

  1. 放弃更新,群已名存实亡。信息源变成某几个人的单一输出,消费远远大于生产。
  2. 本人精力有限,目前忙于其他事情,有想继续维护的朋友,可以联系我。
  3. 虽然此网站不再更新,但是我的个人项目和此项目有重合度。有兴趣的朋友可以关注 《浮之静》

🤝 不在群中的成员,也可以通过 Discussions 自荐信息,或提PR,期待优秀的你加入

规则

  • 👋 分享前端信息为主,八卦闲聊为辅
  • 📝 每周至少发一条信息
  • 🥺 长期不发言者会被踢出群

分享内容要求

  • ✅ 一手信息为主,名称 + 描述 + 感受的格式
  • 🙅 不发重复信息
  • 🈲️ 广告(推广自己的项目也算)
  • 🈲️ 招聘

情报收集

# 信息收集初步构想
fe-cool/news
|- [精选] # awesome
|- [news] # year
|     |- [2021] # year
|     |   |- [04] # month
|     |   |    |- 20 # day
|     |   |    `- ..
|     |   `- ...
|     `- ...
` ...

# 希望可以把收集到的信息通过多次分类
# 把最实用的工具,指南,APP,资讯类整理出来
# 做成一个推荐集合(即精选,文章类暂时排除在外)
# 文章可以在原始信息中进行查看
[2021/04/20.md]  -->  [2021/04/toc.md]  -->  [Awesome]
[day - 原始信息]  -->  [month - 汇总筛选]  -->  [awesome - 推荐]
  • 按日期进行原始信息收集,并在信息前打标签
    • 资讯(news)
    • 工具(tools): chromedocsdev
    • 前端(fe): node, webpack, vite, vue, react
    • VS Code(vsc)
    • WebAssembly(wasm)
    • 编程语言(lang): rustgopython
    • 其他(other): 难以界定的统一分类到其他
  • 月底对本月信息汇总分类(对信息进行筛选)
  • 汇总状态
    • 汇总中... - 📅 起止日期
    • 汇总完成 - 📅 起止日期

项目初衷

此活动是由云谦在微信朋友圈发起的,因为后入群的人其实是看不到之前人的分享的,微信群外的人更不可能看到。既然是在做有意义的事情,就想把这些东西沉淀下来,可以去长时间翻阅。“卷”这个词相信也是最近一两年在技术圈看到最多的一个字。没有信息会让人变得焦虑,💥信息爆炸会让人变得更加焦虑。唯一可以让自己变得不焦虑的途径,就是静下心来,按照自己的节奏,持之以恒。此项目创建的初衷也并非是为了让大家变得焦虑,而是希望站在一个更广阔的角度,去对信息做一层筛选。因为目前所有的收集是群友自荐,自己对文章和技术的理解,都是原始信息记录,还望大家酌情参考。


CC0-1.0 License | Copyright © 2021 fe-cool

精选

随着信息收集工作的进行,我(lencx)发现其中有很多的工具应用技术指南编辑器之类的东西,就想把它们抽离出来,单独进行分类维护。故开辟了精选分类。

Guide

Tools

Weekly

Application

Cross-platform

  • Typora - A new way to read & write Markdown
  • Notion - All-in-one workspace
  • SourceTree - Simplicity and power in a beautiful Git GUI.
  • f.lux - Software to warm up your computer display at night, to match your indoor lighting.

MacOS

  • awesome-mac -  Now we have become very big, Different from the original idea. Collect premium software in various categories.
  • CheatSheet - Know your short cuts
  • Xnip - Handy Screenshot App for Mac
  • Bob - Bob 是一款 Mac 端翻译软件,支持划词翻译、截图翻译以及手动输入翻译。
  • thor - Switch the right application ASAP.
  • Runcat - The cat takes up residence in your Mac's menu bar, and he just keeps running!
  • Kap - An open-source screen recorder built with web technology
  • ImageOptim - Removes bloated metadata. Saves disk space & bandwidth by compressing images without losing quality.
  • MarginNote - A brand new e-reader to better study and digest your books.
  • Things - The all-new Things. Your to-do list for Mac & iOS
  • iStat Menus - An advanced system monitor for your menubar.
  • iTerm2 - iTerm2 is a replacement for Terminal and the successor to iTerm.
  • Maccy - Clipboard manager for macOS which does one job - keep your copy history at hand. Period.
  • Hidden Bar - An ultra-light MacOS utility that helps hide menu bar icons
  • Rectangle - Move and resize windows on macOS with keyboard shortcuts and snap areas.
  • Dropover - Dropover is a utility that makes it easier to manage and move content between folders, applications, windows and workspaces using Drag and Drop.

Windows

VS Code

News

2021.04

汇总完成 - 📅 2021.04.14 ~ 2021.04.30

Tools

  • tooling.report - 为您的下一个 Web 项目确定最佳构建工具的快速方法,或者是否值得进行工具迁移,或者如何在现有配置和代码库中采用工具的最佳实践。
  • docmirror/dev-sidecar - 开发者边车,github 打不开,github 加速,git clone 加速,git release 下载加速,stackoverflow 加速
  • natto.dev | interactive JavaScript space
  • Powerful, Extensible Dev Tools
  • Fusuma - 使用 Markdown 轻松制作幻灯片。
  • rive - 基于 Flutter 开发的网页端动画制作工具(站点支持 PWA) 提供 Web(基于 wasm)、Flutter、Cpp、iOS、Android 五种运行时。
  • Learn Git Branching - 是在web上学习Git最直观、最具交互性的方式;通过挑战关卡,逐步学习Git的特性,使学习过程具有乐趣
  • GitHub520 - 让你“爱”上 GitHub,解决访问时图裂、加载慢的问题。(无需安装)
  • estimator.dev - Calculate the size and performance impact of switching to modern JavaScript syntax
  • Mermaid - 可以使用文本和代码创建图。这简化了复杂图的维护。它是一个基于Javascript的图表绘制工具,可以用Markdown文本来定义各种复杂图表,流程图,顺序图,类图,甘特图,状态图,饼图等。
  • Photopea.com - a free online tool for editing raster and vector graphics with support for PSD, AI, and Sketch files.
  • Portainer - Making Docker and Kubernetes management easy.
  • Logoly Pro - A Simple Online Logo Generator
  • web IDE - 在线写合约,做区块链的前端同学可参考
  • Devops元素周期表,包含了Devops案例学习,模式原则,最佳实践等
  • moiva.io - 工具类站点,可用于评估和比较类库,寻找替代库
  • github1s - 将 github 更改为 github1s 可以查看编辑源码
  • Pull - a GitHub App that keeps your forks up-to-date with upstream via automated pull requests.
  • mdbook - Create book from markdown files. Like Gitbook but implemented in Rust.
  • chrome 拓展程序 - 每天爬  Github Trending 热门 Repo
  • use-what-changed - 一个便于调试 react hook 中依赖项列表变化的小工具
  • Prisma tools are ready for production today!
  • openbase - 工具类站点,寻找类库的工具
  • Wappalyzer - 可以查看网站的技术栈以及使用的相关工具和服务。
  • jExcel - 轻量级的 vanilla javascript 插件,用于创建与 Excel 或任何其他电子表格软件兼容的基于 Web 的交互式表格和电子表格
  • 用于构建交互式流程图的库,reactflow官网egoist/flowkit
  • Infinity - New Tab - 浏览器新标签页,可以定制自己想要的
  • wox - An effective launcher for windows
  • Notion - 知识管理工具。无限树层级的笔记结构,可以自建数据库管理目标/待办/人脉等资源。
  • uTools - 生产力工具集,自由集成丰富插件(可自主开发),快速匹配「场景功能」
  • Marp - Markdown 转 PPT,可自定义模板,配套 VSCode 工具,PPT 制作不再愁
  • LICEcap - 小巧的 gif 生成器,可配置 gif 帧率、压缩参数等,demo 演示好帮手
  • Global Speed - Web extension that sets a default speed for HTML media elements (video and audio).
  • tinypng - 在线压缩图片,压缩之后清晰度还不错!
  • cusdis - 极简的网站嵌入评论工具
  • Excalidraw - 手绘风格的画图工具,支持 svg、png 格式的导出,支持 PWA,支持协作。
  • Things - 一款非常优秀的 GTD 工具
  • 调试页面 - 可以用来 debug 微信的 webview ,仅支持 android
  • blockly - 一个 Google 的有点像少儿编程的工具
  • vue-trend - 超级小的图表库
  • shadow1ng/fscan - 一款开源内网综合扫描工具,方便一键自动化、全方位漏扫扫描。例如:web 指纹识别、web 漏洞扫描、netbios 探测、域控识别等。
  • js AST 可视化解析 - 可以转 svg ,png,帮助你 AST 语法结构
  • AdGuard - 一款去广告的 google chrome 扩展程序, 也有软件版本, 但不免费, 且不太需要, 基本的能力已经挺符合了
  • IDM - 下载工具、断点断续、多线程、甚至 google drive 也可以断点断续, 相对稳定的媒体嗅探, bilibili youtube p* 等都可以出现浮窗 可以下载.
  • snipaste - 有免费版本,截图 贴图 取色 方便的取历史图片 各种标记。
  • charles - 一款抓包修改工具
  • FeHelper - 一款 google chrome 扩展程序, Web 前端助手,扩展功能很多
  • lighthouse - 网页检测工具,可以直观展示页面性能,性能优化建议,搜索引擎优化建议等
  • Markdown Viewer - 在浏览器预览 markdown 的谷歌插件(有时会对 github 的 README-*.md 有副作用)
  • Personal Blocklist - 谷歌搜索屏蔽不需要的网站,谷歌插件
  • Carbon - 生成好看的代码图片
  • Octotree - 可以更加友好地让你去浏览阅读 GitHub 上的项目。
  • OneTab - 一键解决浏览器打开页签多,内存占用大。
  • LastPass - 非常好用的密码管理工具。
  • iStat Menus - 一款系统状态监控工具。
  • sourceTree - 一款可视化 git 管理工具。
  • draw.io - 免费客户端、网页版都有的画流程图工具,功能强大。
  • pocket - 谷歌浏览器插件,用来随手看到好的文章很方便地收藏
  • Online text to diagram tools
  • 可视化解析 npm 包依赖项目
  • Avatar Maker - Create your own avatar with Vue Avatar Maker app.
  • Regulex - JavaScript Regular Expression Visualizer.
  • CSS Gradient - As a free css gradient generator tool, this website lets you create a colorful gradient background for your website, blog, or social media profile.
  • ADB - 实际开发中app内嵌webview很常见,但是安卓环境调试,出了开模拟器,可以试试adb插件,很好用
  • calendso - 知名日程安排工具(Calendly)的开源替代品。
  • fscan - 一款内网综合扫描工具,方便一键自动化、全方位漏扫扫描。
  • JS Tooling not in JS - A curated list of JavaScript tooling not written in JavaScript
  • why-did-you-render - 通过 monkey patches React 来通知您可能可以避免的 re-renders,同时适用于 react-native
  • transform - 支持各种代码转化的工具,SVG、JSON、TS、GraphQL、CSS、SQL,只要你能想到的这里都有。光 JSON 就可以转化为十几种代码格式,如把 JSON 转化成 Flow、Go、GraphQL、Typescript、Kotlin、MySQL、YAML等。本项目开源,你可以通过代码学习到它是如何进行格式转换的。

Open Source

  • yjs - 一个新的基于CRDT的开源数据协同框架,常用来做在线编辑产品
  • 腾讯开源: Vap - 企鹅电竞开发,用于播放酷炫动画的实现方案,Android, iOS, web 通用。
  • rn-range-slider - A highly optimized and fully customizable pure JS component for value range selection.
  • Duilib 一个Windows下免费开源的DirectUI界面库,腾讯、网易都在用
  • EasyFaaS - EasyFaaS是一个依赖轻、适配性强、资源占用少、无状态且高性能的函数计算服务引擎
  • 喵语翻译 - 将人类语言翻译为喵语言
  • dagre - Graph layout for JavaScript
  • WinBox - 是用于Web的专业HTML5窗口管理器:轻巧,性能出色,无依赖项,完全可自定义,支持最大化,最小化,自由拉伸及拖动等
  • esmon - 类似 nodemon 但基于 esbuild,支持 ts 等
  • Recoil - A state management library for React
  • pullstate - Simple state stores using immer and React hooks - re-use parts of your state by pulling it anywhere you like!
  • react-amap - 基于 React 封装的高德地图组件,助你轻松的接入高德地图到 React 项目中。
  • nodejs 源码解析
  • Run multiple promise-returning & async functions with limited concurrency
  • vite-plugin-vue-gql - GraphQL Tags for your Vue SFC
  • libp2p-rs - rust 实现的 libp2p
  • rbatis - 用 rust 实现 ORM 框架
  • iced - rust 9.2K 跨平台 GUI 仓库
  • swc - rust 编写的超快速的 typescript/ javascript 编译器
  • 北海 - 基于 Flutter 的 Web 渲染引擎正式开源
  • FicusJS - 基于 webcomponent 实现的轻量开发库
  • LogicFlow - 滴滴开源,专注流程可视化的前端框架
  • APIJSON - 腾讯开源
  • material-tailwind - 基于 react、material、tailwind 开发的组件库
  • react-to-print - react 中指定打印节点而并不需要写内联样式的库
  • Eva.js - Eva.js is a front-end game engine specifically for creating interactive game projects.
  • rtk-query - 基于 redux toolkit 的 data fetch 和 caching 工具,还在用 redux 的可以关注下。
  • Finished Proposals - Finished proposals are proposals that have reached stage 4, and are included in the latest draft of the specification.
  • pytorchjs - Torch and TorchVision, but for NodeJS.
  • NPlayer - 无任何第三方运行时依赖,兼容 IE11,支持 SSR。高度可定制,可二次开发。和 B 站一样体验的弹幕系统。可以接入任何流媒体,支持直播。
  • ReactFlow - Highly customizable library for building interactive node-based UIs, editors, flow charts and diagrams.
  • Fabric.js - Javascript Canvas Library, SVG-to-Canvas (& canvas-to-SVG) Parser
  • framer/motion - Open source, production-ready animation and gesture library for React
  • awesome-f2e-libs - 整理我(云谦)平时关注的前端库
  • translate.css - Drop-in CSS transitions
  • ChatUI - 对话式交互应用UI库,达摩院开源作品
  • DSBridge-Android - A modern cross-platform JavaScript bridge, through which you can invoke each other's functions synchronously or asynchronously between JavaScript and native.
  • javascript-state-machine - A javascript finite state machine library
  • windicss - Next generation utility-first CSS framework.
  • replay - A React video player facilitating adaptive stream playback with custom UI and a React-friendly API.
  • vue3-markdown-it - An awesome Vue 3 markdown-it wrapper plugin that can even support external plugins!
  • code-to-graph - Transforms code (JS) into graphs (graphviz, mermaid flowchart, ...)
  • @pansy/watermark - watermark component
  • air-conditioner - 云空调,便携小空调,为你的夏日带去清凉!

Guide

Weekly

VS Code

APP

  • CheatSheet APP(mac) - Just hold the ⌘-Key a bit longer to get a list of all active short cuts of the current application. It's as simple as that.
  • macos in preact - 源码
  • typora - 跨平台 md 编辑器
  • Xnip - mac 端下比较好的截图软件,支持打码、步骤标注等常用功能
  • Bob - 翻译软件,支持划词翻译和截图 ocr 翻译,注意服务配多点效果比较好,多个翻译服务对照着看
  • thor - 通过快捷键一键切换和隐藏各种软件(老板键?),搭配 Karabiner Element 修改右 command 为 hyper 键可进一步提升快捷键的选择空间
  • Runcat - The cat will run at a speed that depends on the CPU usage on your Mac. You can see how much the current CPU usage is by looking at the running of the cat.
  • Unsplash Wallpapers - Bringing you thousands of magical moments to your screens.
  • Kap - 非常好用的 gif 截屏 小工具
  • ImageOptim - 使图像加载更快 删除肿的元数据。通过压缩映像节省磁盘空间和带宽,而不会降低质量。支持多种图片格式,自定义压缩质量
  • MarginNote - 整理知识地图,构建自己的知识体系,强烈推荐在 iPad Pro 上搭配 pencil 使用
  • meld - 基于bedrock的脚手架搭建
  • vue-luck-draw - Vue 写的一个抽奖类库
  • pap.er, 专为 Mac 设计的壁纸应用 每天享受来自全球新鲜精美的壁纸
  • Maccy - 随时保留复制历史记录,轻巧快捷
  • f.lux - 屏幕蓝光过滤
  • Hidden Bar - 隐藏 mac 菜单栏图标
  • Rectangle - 使用快捷键快速调整窗口大小及位置
  • Dropover - Dropover is a utility that makes it easier to manage and move content between folders, applications, windows and workspaces using Drag and Drop.

WebAssembly

  • Learning WebAssembly Series - webAssembly 系列入门文章,从代码示例到原理讲解
  • WebAssembly 入门 (Vite + Rust)
  • NoteCalc - 带有智能内置计算器的便捷记事本。功能强大,使用 webAssembly+canvas 构建应用。
  • Telegram React - based on the ReactJS JavaScript framework and TDLib (Telegram Database library) compiled to WebAssembly。
  • Ant Design of Blazor - WebAssembly 版本的 antDesign,语法类似 tsx。
  • v86 - v86模拟与x86兼容的CPU和硬件。 机器代码在运行时转换为WebAssembly模块,以实现良好的性能,支持多种仿真硬件。

Algorithms

Terminal

  • tools/terminal - lencx自用
  • thefuck - 命令行神器,当输错 linux 命令,fuck 一下,提示你可能想输入的命令。
  • kenshinji/yddict - 一个命令行查单词的工具
  • Fig - adds VSCode style autocomplete to your terminal
  • iterm2 - 一款命令行终端模拟器,(iTerm2 + Oh My Zsh 一套相关配置大大提升效率)

Community

  • Lore Free - 首个基于 EOS 和 IPFS 的去中心化知识共享社区
  • 柠檬精选 - 腾讯柠檬精选——收录免费、正版、好用的 Mac 产品
  • xclient - MAC 应用分享平台

Micro Frontends

  • 面向大型系统的微前端解决方案
  • icestark - 面向大型系统的微前端解决方案
  • m-app - 新一代微前端解决方案,微应用容器组件,对 DOM、CSS、JS 进行硬隔离,达到真正的技术栈无关,并且运行时集成,微应用可独立开发、部署、升级。使用如 iframe 般简便,却超脱 iframe 的局限,你值得一试!

Icons

  • IconPark - 字节跳动出品的高质量开源图标
  • 700+CSS Icons - Open-source CSS, SVG and Figma UI Icons. Available in SVG Sprite, styled-components, NPM & API.

Low Code

  • sparrow - 场景化低代码(LowCode)搭建工作台,实时输出源代码
  • yoma - 一个小而美的低代码全栈开发平台,一键生成后端api接口+前端页面代码+在线接口文档,节省50%的前后端开发的工作量,平台代码100%开源。平台适用于企业信息化、政务、中小型互联网等项目
  • citrus - 低代码快速开发脚手架,灵活、高效,降低开发成本
  • vue-low-code - Quant-UX standalone

🎉 彩蛋: 如何信息获取?

  • 云谦:我的信息来源主要这些

    1. twitter 新建个 list 关注国内外前端大牛,然后按 top 排序
    2. github 1) 通过 watch > custom > Releases 订阅感兴趣库的 release 信息 2) follow 一些人
    3. 邮箱订阅各种 weekly 邮件列表
    4. rss 订阅,来源很杂 信息流的方式基本没变,可参考两年前花的图,《2019-04-sorrycc-我的输入信息流》
  • xiaohuoni: 我的信息输入较少,更多喜欢从纸质书籍上得到信息。

    1. 当当图书推荐榜-优先计算机,语言类。
    2. github 首页,主要是通过关注的人的动态,还有explore里面的推荐
    3. dev.to 通过 tags 过滤,也关注热度榜单。dev开源之前是我的主要信息来源。一直想着做一个国内站点,开源的时候,看了一下技术栈与我掌握的差异太大。反而连这个网站都少上了。
    4. 云谦早报和他个人动态现在是我的主要信息来源。
    5. 阮一峰的周报,issues区有很多信息 ruanyf/weekly
  • 浩明: 我的信息来源主要这几个博客和平台

    1. github 上 follow 的动态
    2. Jake Archibald 博客
    3. Dan Abramov 博客
    4. David Walsh 博客
    5. 阮一峰,张鑫旭 的博客
    6. 公众号,知乎

💭 补充: 我本人lencx也 follow 过许多国外大牛,因为人数太多暂时无法整理出来,感兴趣的可以查看

2021.04.14

2021.04.15

2021.04.16

2021.04.17

2021.04.18

  • chrome Google的.new快捷方式,Google为Google文档、幻灯片和表格引入了方便的“ .new”快捷方式,网站运营方也可以注册自己在线快捷方式的.new域,例如:

    • 新建Google文档:docs.new
    • 新建Google幻灯片:slides.new
    • 新建Google表格:sheets.new
    • Spotify新建播放列表: playlist.new
    • Medium新建文章:medium.new
  • wasm tools NoteCalc带有智能内置计算器的便捷记事本。功能强大,使用webAssembly+canvas构建应用。

  • vite 项目中vite遇到的坑收集

  • react react-hook-form v7,React Hooks for forms validation (支持Web+RN),

  • tools 😘 让你“爱”上 GitHub,解决访问时图裂、加载慢的问题。(无需安装)

  • fe docs 微软开源项目 - 面向初学者的Web开发-课程,包含视频,插图笔记,任务,补充阅读,课后测验等。

  • docs tools 新文章:“腾讯开源的酷炫动画播放解决方案Vap初体验” - H5中希望有炫酷3D动效,但是3D WebGL实力不允许,可以试试使用本文要介绍的VAP,导出PNG图片序列,可以有高性能的炫酷动画效果,Android和iOS也可以使用。

  • fe docs 微前端在美团外卖的实践。

2021.04.19

2021.04.20

2021.04.21


🎉 彩蛋: 如何信息获取?

  • 云谦:我的信息来源主要这些

    1. twitter 新建个 list 关注国内外前端大牛,然后按 top 排序
    2. github 1) 通过 watch > custom > Releases 订阅感兴趣库的 release 信息 2) follow 一些人
    3. 邮箱订阅各种 weekly 邮件列表
    4. rss 订阅,来源很杂 信息流的方式基本没变,可参考两年前花的图,《2019-04-sorrycc-我的输入信息流》
  • xiaohuoni: 我的信息输入较少,更多喜欢从纸质书籍上得到信息。

    1. 当当图书推荐榜-优先计算机,语言类。
    2. github 首页,主要是通过关注的人的动态,还有explore里面的推荐
    3. dev.to 通过 tags 过滤,也关注热度榜单。dev开源之前是我的主要信息来源。一直想着做一个国内站点,开源的时候,看了一下技术栈与我掌握的差异太大。反而连这个网站都少上了。
    4. 云谦早报和他个人动态现在是我的主要信息来源。
    5. 阮一峰的周报,issues区有很多信息 ruanyf/weekly
  • 浩明: 我的信息来源主要这几个博客和平台

    1. github 上 follow 的动态
    2. Jake Archibald 博客
    3. Dan Abramov 博客
    4. David Walsh 博客
    5. 阮一峰,张鑫旭 的博客
    6. 公众号,知乎

💭 补充: 我本人lencx也 follow 过许多国外大牛,因为人数太多暂时无法整理出来,感兴趣的可以查看

2021.04.22

  • tools chrome Wappalyzer - 100 w+ 下载量,可以查看网站的技术栈以及使用的相关工具和服务。

  • js jExcel - 轻量级的vanilla javascript插件,用于创建与Excel或任何其他电子表格软件兼容的基于Web的交互式表格和电子表格

  • js guide 基于 Next.JS 的 Incremental Static Regeneration (ISR) 指引 新名词 ISR,增量的静态页面生成,适用于内容型站点

  • terminal 由于配置及插件过多,以链接形式分享tools/terminal

  • flowchart 用于构建交互式流程图的库,wbkd/react-flow网站egoist/flowkit

  • browser 浏览器新标签页,可以定制自己想要的标签infinity

  • terminal thefuck - 命令行神器,当输错linux命令,fuck一下,提示你可能想输入的命令。

  • redux rtk-query - 基于 redux toolkit 的 data fetch 和 caching 工具,还在用 redux 的可以关注下。

  • tools Everything (Windows search tool 毫秒级响应)

  • tools wox - An effective launcher for windows

  • app typora - 跨平台md编辑器

  • app Xnip - mac 端下比较好的截图软件,支持打码、步骤标注等常用功能

  • app Bob - 翻译软件,支持划词翻译和截图 ocr 翻译,注意服务配多点效果比较好,多个翻译服务对照着看

  • app thor - 通过快捷键一键切换和隐藏各种软件(老板键?),搭配 Karabiner Element 修改右 command 为 hyper 键可进一步提升快捷键的选择空间

  • app Runcat - 每个人看到我的电脑都会问这个猫是干啥的,菜单栏猫跑地越快 cpu 占用越高

  • app wallpaper Unsplash Wallpapers,mac 下壁纸日更软件,让你在办公室看景

  • tools Notion - 现体验最好的自用知识管理工具。无限树层级的笔记结构,可以自建数据库管理目标/待办/人脉等资源,十分适合程序员,可以让工具根据你的生活模式定制;Notion安利

  • vsc Partial Diff,vscode 插件,能够对选定的两部分内容进行内容比对,等于 git 的单个文件 diff 功能

  • vsc Todo Tree - vscode 插件,收集项目中你所有代码中备注遗留要做(也许不会)的事情,让你成为时间管理大师

  • tools uTools生产力工具集,自由集成丰富插件(可自主开发),快速匹配「场景功能」,用完即走

  • app Kap - 非常好用的 gif截屏 小工具

  • vsc CodeMetrics - vscode插件,用来计算 ts / js / lua代码的复杂度,帮助我们更好的重构代码。

  • tools Marp - Markdown 转 PPT,可自定义模板,配套 VSCode 工具,PPT 制作不再愁

  • tools LICEcap - 小巧的 gif 生成器,可配置 gif 帧率、压缩参数等,demo 演示好帮手

  • tools 加速视频播放速度,最高16倍。

  • tools tinypng - 在线压缩图片,压缩之后清晰度还不错!

  • app ImageOptim - 使图像加载更快 删除肿的元数据。通过压缩映像节省磁盘空间和带宽,而不会降低质量。支持多种图片格式,自定义压缩质量

  • tools cusdis - 极简的网站嵌入评论工具

  • app MarginNote = 不仅仅是笔记,不仅仅上学看论文用,碎片化信息严重,整理知识地图特别重要,构建自己的知识体系,强烈推荐在 iPad Pro 上搭配 pencil 使用,MarginNote3,用过十几款软件之后唯一愿意付费使用的,没有之一

  • other meld - 基于昨天的 $450 的脚手架搭建

  • tools 25个不可错过的实用前端工具

  • tools Excalidraw - 手绘风格的画图工具,Dan Abramov 的 [Just JavaScript] 系列就用到了这个。支持 svg、png 格式的导出,支持 PWA,支持协作。

  • terminal node kenshinji/yddict - 一个命令行查单词的工具

  • app tools Things - 一款非常优秀的 GTD 工具

  • book Lore Free - 首个基于EOS和IPFS的去中心化知识共享社区

  • fe debug 调试页面 - 可以用来 debug 微信的 webview ,仅支持 android

  • other blockly - 一个Google的有点像少儿编程的工具

  • vue chart vue-trend - 超级小的图表库

  • vue vue-luck-draw - Vue 写的一个抽奖类库

  • tools shadow1ng/fscan - 刚开源一款内网综合扫描工具,方便一键自动化、全方位漏扫扫描。例如:web指纹识别、web漏洞扫描、netbios探测、域控识别等。

  • js FicusJS - 基于webcomponent实现的轻量开发库

  • react react 另外一种状态管理 GraphQL + TypeScript + React + Apollo

  • js 考古挖掘:高刷显示器下的 requestAnimationFrame

  • tools js AST 可视化解析 - 可以转 svg ,png,帮助你 AST 语法结构

  • serverless 美团公共服务serverless 云函数建设情况、架构、生态、业务落地收益

  • js flowchart LogicFlow - 滴滴开源,专注流程可视化的前端框架

  • react logo React China Logos - React + 中国结

  • react Relay vs Apollo - 结合 React 的graphql两种客户端对比

  • other APIJSON - 腾讯开源

  • other 柠檬精选 - 腾讯柠檬精选——收录免费、正版、好用的Mac产品

  • browser AdGuard - 一款去广告的google chrome 扩展程序, 也有软件版本, 但不免费, 且不太需要, 基本的能力已经挺符合了

  • tools IDM - 下载工具 断点断续 多线程 甚至google drive这种 也可以断点断续, 相对稳定的媒体嗅探, bilibili youtube p* 等都可以出现浮窗 可以下载. 荔枝上买正版30一年

  • tools snipaste - 有免费版本 够用了 截图 贴图 取色 方便的取历史图片 各种标记 针不戳.

  • other xclient - MAC应用分享平台

  • tools charles - 一款抓包修改工具, 操作简单但功能不错, 最近常用本地映射功能, 提升了调试效率 (1. 大部分本次调试不需要数据变动的接口, 不需要等待后端返回了 2. 如果需要造固化的调试数据, 也可以以文件的方式修改好 3. google chrome 控制台 networks 这个选项卡中, 可以右键屏蔽一些请求)

  • browser tools FeHelper - 一款google chrome 扩展程序, Web前端助手,扩展功能很多

  • fe tools lighthouse - 网页检测工具,可以直观展示页面性能,性能优化建议,搜索引擎优化建议等 解析lighthouse检测流程

  • browser Markdown Viewer - 在浏览器预览markdown的谷歌插件(有时会对github的 README-*.md 有副作用)

  • browser Personal Blocklist - 谷歌搜索屏蔽不需要的网站,谷歌插件

  • tools Carbon - 生成好看的代码图片

  • other wallpaper pap.er, 专为 Mac 设计的壁纸应用 每天享受来自全球新鲜精美的壁纸

  • browser Octotree - 可以更加友好地让你去浏览阅读GitHub上的项目。

  • browser OneTab - 一键解决浏览器打开页签多,内存占用大。

  • tools LastPass - 非常好用的密码管理工具。

  • app tools iStat Menus - 一款系统状态监控工具。

  • app tools iterm2 - 一款命令行终端模拟器,(iTerm2 + Oh My Zsh一套相关配置大大提升效率)

  • app tools sourceTree - 一款可视化git管理工具。

  • news 湾区日报 - 关注创业与技术,每天推送3到5篇优质英文文章

  • tools flowchart draw.io - 免费客户端、网页版都有的画流程图工具,功能强大。

  • browser pocket - 谷歌浏览器插件,用来随手看到好的文章很方便地收藏

2021.04.23

2021.04.24

  • svelte SvelteKit is in public beta

  • player NPlayer - 无任何第三方运行时依赖,兼容 IE11,支持 SSR。高度可定制,可二次开发。和 B 站一样

  • micro-frontends m-app - 新一代微前端解决方案,微应用容器组件,对 DOM、CSS、JS 进行硬隔离,达到真正的技术栈无关,并且运行时集成,微应用可独立开发、部署、升级。使用如 iframe 般简便,却超脱 iframe 的局限,你值得一试!

2021.04.25

2021.04.26

2021.04.27

2021.04.28

2021.04.29

2021.04.30

2021.05

汇总中... - 📅 2021.05.01 ~ 2021.05.14

Tools

  • Rome - Rome is a linter, compiler, bundler, and more for JavaScript, TypeScript, JSON, HTML, Markdown, and CSS.
  • slidev - Presentation Slides for Developers (Public Beta 🎉)
  • swimlanes.io - Swimlanes.io is a simple free online tool for making sequence diagrams
  • Preset - A command line tool for kickstarting your application's development by applying presets on top of it.
  • cusdis - lightweight, privacy-friendly alternative to Disqus.
  • ChaosBlade - 阿里巴巴开源的一款简单易用、功能强大的混沌实验注入工具
  • uncode - Uncode 是一个面向云研发时代设计的下一代概念性 IDE。
  • JimuReport - 一款免费的数据可视化工具,报表和大屏设计,像搭建积木一样在线设计报表!功能涵盖,数据报表、打印设计、图表报表、大屏设计等!
  • 10 Best Online Flowchart Software Of 2021
    • Creately - Best collaborative flowchart software with live video conferencing
    • Miro - Best free flowchart software
    • Microsoft Visio - Best flowchart software for Windows
    • Gliffy - Best flowchart tool for Confluence & Jira (native Atlassian integrations)
    • Edraw Max - Best all-purpose diagramming software
    • ConceptDraw Diagram - Best flowchart software download (buy a one-time license)
    • Cacoo - Best online flowchart software for real-time team collaboration
    • Terrastruct - Best flowchart tool for software development
    • VisualParadigm Online - Best flowchart software for agile software development & data analytics
    • Draw.io - Best easy to use flowchart freeware
  • Replace Google CDN - 一个 Chrome 插件:将 Google CDN 替换为国内的。

Open Source

  • FingerprintJS - Browser fingerprinting library with the highest accuracy and stability.
  • inspx - Pixel perfect layout inspection.
  • mantine - React components and hooks library with native dark theme support and focus on usability, accessibility and developer experience
  • React-Toastify - React notification made easy 🚀 !
  • Fish Design - 面向B端设计的企业级UI组件库

Guide

Weekly

WebAssembly

MacOS

  • awesome-mac -  Now we have become very big, Different from the original idea. Collect premium software in various categories.

2021.05.01

2021.05.06

2021.05.07

  • tools Preset - 一个命令行工具,preset,通过应用预设来快速构建或升级你的应用

  • tools disqus cusdis - 一个轻量化的评论工具,cusdis,前端部分采用了 vite

  • news sorrycc/weekly - 前端周刊,每周一发布。

  • js JavaScript Temporal API- A Fix for the Date API - 又一篇关于 JavaScript Temporal API 的文献,相关 propsal 已经到了 stage-3

  • react React-Toastify - 一个好用的React通知组件库,支持多种配置

2021.05.08

2021.05.11

2021.05.13

  • lowcode report JimuReport - 一款免费的数据可视化工具,报表和大屏设计,像搭建积木一样在线设计报表!功能涵盖,数据报表、打印设计、图表报表、大屏设计等!

  • flowchart 2021年10种最佳在线流程图软件

    • Creately - Best collaborative flowchart software with live video conferencing
    • Miro - Best free flowchart software
    • Microsoft Visio - Best flowchart software for Windows
    • Gliffy - Best flowchart tool for Confluence & Jira (native Atlassian integrations)
    • Edraw Max - Best all-purpose diagramming software
    • ConceptDraw Diagram - Best flowchart software download (buy a one-time license)
    • Cacoo - Best online flowchart software for real-time team collaboration
    • Terrastruct - Best flowchart tool for software development
    • VisualParadigm Online - Best flowchart software for agile software development & data analytics
    • Draw.io - Best easy to use flowchart freeware
  • chrome tools Replace Google CDN - 一个 Chrome 插件:将 Google CDN 替换为国内的。

  • wasm 2021.05.15 北京站 WebAssembly meetup,议题包含

    • 基于WebAssembly的人像分割技术在RTC领域的应用
    • 用 Serverless WebAssembly 解决 SaaS 平台的定制化难题
    • 基于 Wasm 的 ServiceMesh 扩展
    • WebAssembly 踩坑记 —— Lightning Talk
  • mac awesome-mac - 收集各种类别非常好用的 Mac 应用程序、软件以及工具。

  • js Clean Code Applied to JavaScript: Series - js代码整洁之道系列

  • ts TypeScript整理 - 好用实用的TS技巧、理念、工具。

2021.05.14

2021.05.17

2021.05.18

2021.05.22

2021.05.26

2021.05.31

2021.06

2021.06.01

  • wasm Pyodide Spin Out and 0.17 Release - Mozilla 的项目,让Python 运行在浏览器

  • emulator jslinux - Run Linux or other Operating Systems in your browser!

  • emulator wasm v86 - x86 virtualization in your browser, recompiling x86 to wasm on the fly。