JS周刊#430 - 未来是否可以没有 webpack?以及采访 Nicolás Bevacqua

⚡️ 这周我们进行了一次采访,在本期最后可以看到,这次采访的是有名的 Pony Foo 网站的 Nicolás Bevacqua。

有性能责任的 JavaScript:第一部分

Jeremy Wagner 制作了一个课程,以规避当前 JavaScript 趋势中的不必要膨胀和无法访问模式。

Jeremy Wagner

你应该知道的 JavaScript 数组

这篇文章取了一个高端大气的标题。它深入探讨了使用数组的所有不同方法。不过如果你是 JavaScript 专家级的开发人员,请略过这篇 ↓

Thomas Lombart

在全球云网络上构建和部署 serverless 应用程序

了解如何通过 JavaScript 编写 serverless API,并为你的下一个项目保留自定义子域名。

Cloudflare Workers 赞助

@pika/web,未来是否可以没有 webpack?

@pika/web 使用了一种并非没有争议的方式,可以安装在浏览器本地运行的 npm package。

Fred K. Schott

Majestic:用于 Jest 的零配置 GUI

一个有趣的工具,可以帮助你轻松地进行 JavaScript 测试。现在尝试在任何使用 Jest 进行测试的项目的文件夹中(假设你已经安装过 npm)运行 npx majestic

Raathi Kugarajan

使用 JavaScript 和 WebGL 进行高级地图着色

这篇文章非常简洁和彻底地看待 JavaScript 中一个有趣用途:卫星图像着色。最终结果很漂亮。

Rye Terrell

保持 JavaScript 愚蠢

Cluetrain Manifesto 宣言的合著者之一 David,在美国科技界担任了 一个重要角色,他认为 JavaScript 被业余爱好者搞得难用,已经损害其易用性。他承认他的观点可能是错的,但讨论这些问题很重要。

David Weinberger

📘 教程和见解

map, reduce, filter 这些数组方法的图解(和音乐)指南

看下如何使用这三个有用的 JS 数组方法。

Una Kravets

尝试使用 Streams API

你可能会将流和 Node.js 关联在一起,但你是否知道在浏览器中也支持它?

Dean Hume

将属性有条件地插入到对象字面量的最短方式

这篇深入研究一个极其简短、但会令人困惑于 JavaScript 是如何运行的案例。我不确定我喜欢这种方式,但是解释很不错。

Andrea Simone Costa

数组循环中 async/await 的陷阱

在循环数组时使用 async / await 看起来很简单,但需要注意一些不符合直觉的行为。

Tory Walker

在 10 分钟内,使用 MongoDB Stitch 构建 Slack 应用程序

想用聊天机器人和其他命令扩展 Slack?查看本教程,了解如何使用 MongoDB Stitch 在 10 分钟内构建 Slack 应用程序。

MongoDB 赞助

使用 Vue.js 创建可复用的分页组件

Mateusz Rybczonek

在 JavaScript 中,如何从数组中删除重复项

依靠 ES6 的 set 支持,似乎是最快的方式。

Maciej Cieślar

在 Hook 中定义的 React 路由:一种新的路由方式?

与现有 router 相比,hookrouter 具有一些引人注目的优势。

Christian Engel

🔧 代码和工具

Tone.js:浏览器交互式音乐的音频框架

有许多主要功能的 示例,但也有 所有完整 demos 供参考。

Yotam Mann

比起使用 Breakpoints 或 console.log,更快速的调试代码方式

Wallaby 会在测试和代码中捕获错误,并在输入时在编辑器中显示它们的结果,通过在开发中获得循环反馈而使生产效率更高。

Wallaby.js 赞助

Vue DevTools 5.0:用于调试 Vue 应用程序的 DevTools 扩展

一个重要的全新版本(5.0.0),添加了各种新功能,包括新的 tabs 和 NativeScript 支持。适用于 FirefoxChrome

Vue.js

eslint-plugin-unicorn:各种极致的 ESLint 规则

包括 34 个不同的规则,例如:强制文件名大小写风格,禁止 process.exit(),避免不安全的正则表达式等等。

Sindre Sorhus et al.

Angular 开发人员推荐的 VS Code 扩展

John Papa

工程师领导力培训:自由谈话 - 立即报名

Big Nerd Ranch 赞助

📊 Cube.js:开源分析框架

用于构建内部 BI 工具或客户仪表板等内容。这里有一个指南

Statsbot

React LoadCon:使用 Favicon 显示进度

将页面 favicon(在浏览器新标签页中显示)改为可以指示进度的圆环或圆形。GitHub 仓库

foreseaz

💬 采访问答

Mastering Modular JavaScript 的作者

Nicolás Bevacqua 是一位长期 JavaScript 开发人员,曾撰写过多本书,最近出版了 Mastering Modular JavaScript(掌握模块化 JavaScript) 这本书。本期我们采访了他,提出一些关于模块化 JavaScript 开发的问题:

一句话说明精通模块化 JavaScript

控制复杂度是很困难的。今天,越来越多的应用程序转向使用前端 JavaScript 框架,并且许多应用程序选择 React。你可能已经注意到 React 应用程序是如何构建为具有生命周期的组件树。这些树不仅是封装代码的理想选择,同时也在鼓励着模块化代码。编写模块化 JavaScript,在很大程度上,是将代码复杂度拆分到小的软件片段中。

你在模块化方面看到的最常见错误是什么?

在应用程序的每个级别,例如:模块、函数、代码块和单个表达式,都有模块化思维的空间。最常见的错误之一是,随着模块越来越大,而不去拆分模块(或函数或代码块)。甚至在一些模块化应用程序中,模块变得非常庞大也并不罕见。要经常修剪你的树木! 🌳

对于希望改进代码结构的开发人员,你认为必须阅读哪些资源?

我读过关于构造代码的最有影响力的作品之一,绝对是 The Twelve Factor App(应用程序的十二个因素)。它确实塑造了我思考和编写开源软件的方式。

在判断某些关键性能瓶颈是在浏览器代码或是 web service 处理造成,性能意识都是很有用的。High Performance Browser Networking(高性能浏览器网络) 可以帮助你尊重用户网络,并鼓励传输更少字节。

如果你密切关注一些可探索的方向,或许你会对安全方面感兴趣,例如,未作转义或缺乏无害处理的用户输入会造成安全问题。Tangled Web 是这个领域的一本好书。

如果你能让 JavaScript 开发人员都采纳一个建议,它会是什么?

所有人吗? 停止使用 webpack!poof(吹蜡烛声) 🔥

你是 Pony Foo 的幕后推手 - 有什么新内容?

我们的目标是重新发明 Pony Foo,使其成为 web 开发人员的首选平台之一,如同 CSS-Tricks 或 Smashing Magazine 那样。我们已经编排好很多文章,我们正在寻找(付费的)分享作者!

Nicolás Bevacqua 运营着 Pony Foo,是 Elastic 的 JavaScript 开发人员。


🔗 访问链接