#591 — May 27, 2022 |
JavaScript Weekly |
 |
| Comparing Three Ways of Processing Arrays Non-Destructively — The good doctor of JavaScript puts Dr. Axel Rauschmayer |
| npm Security Update: What GitHub's Learnt About April's Attack — Last month, GitHub, the stewards of the npm registry, reported that stolen OAuth tokens were used to access certain private repositories, private package manifests & metadata, as well as npm user account data. Here's an update. Notably: “GitHub discovered a number of plaintext user credentials for the npm registry that were captured in internal logs following the integration of npm into GitHub logging systems.” Ouch. Don't store secrets or credentials in version control (or logs). Greg Ose (GitHub) |
 Making TypeScript 'Stick' — Test your knowledge through quizzes, challenges, and even a TypeScript gameshow in this new course by Mike North! Frontend Masters sponsor |
| TypeScript 4.7 Released — The headline feature for the typed JavaScript superset is ES module support for Node.js – a feature that has been infamously difficult to implement, and whose reliance on file extensions continues to provoke debate – plus CommonJS interoperability (from ES modules), improved function inference, control-flow analysis for bracketed element access, and more. Daniel Rosenwasser |
| Next.js's Layouts RFC: Big Changes Ahead for Next.js — If you’re a Next.js user, you’ll want to read this as some significant updates are on the way, particularly around routing, app structure, and layouts (including nested layouts). Neutkens, Markbage, et al. (Vercel) |
| IN BRIEF:
RELEASES:
|
|
📒 Articles & Tutorials |
 |
| What is 'Edge Compute?' 'It's Kind of Like Knitting Dog Hats' — Look, the metaphor made us laugh, and the author stretches it out quite a long way here. “Cloud functions are like robots trained to knit dog-hats” – got it? Austin Gil |
| How Airbnb Gets Faster JavaScript Builds with Metro — The story of Airbnb’s migration from Webpack to Metro (a JavaScript bundler aimed at React Native – but Airbnb uses it for Web projects) and how it made their development feedback loop ‘nearly instantaneous’. Rae Liu |
| Dark Patterns in UX — Higher-order functions are an important feature that cannot be overlooked in functional programming, allowing for easy nesting of functions to archive a specific task. Learn more about them from this article. Kendo UI for Angular sponsor |
| How We Converted Our Node.js Library to Deno (using Deno) — “We landed on a “runtime adapter” pattern that we think represents a general-purpose approach that may be useful to other library authors looking to support Deno.” James Clarke (EdgeDB) |
| A Roundup of React State Management Libraries in 2022 — There are a lot of options in this space including Zustand, Recoil, XState and, of course, Redux. Albert Gao |
| JSON and the Stringification Oddities in JavaScript — It’s not the most straightforward thing, although there is at least a (complicated) written spec for Zhenghao |
| The Balance Has Shifted Away From SPAs — “how the context has changed in recent years to give MPAs more of an upper hand against SPAs”. (MPAs are Multi-Page Apps. Or just ‘apps’ to me.) Nolan Lawson |
| Add a Professional Scheduling Widget to Your MES App Bryntum sponsor |
| Avoiding Puppeteer Antipatterns |
| 5 Things That Make Astro Unique for Building Web Apps |
🛠 Code & Tools |
 |
| 🥷 Ninja Keys: Add a Command Palette / Keyboard Shortcuts Interface to Your App/Site — If you’ve used Cmd/Ctrl+K on GitHub or the command palette in tools like VS Code, this will feel familiar to you and it’s at home in vanilla JS apps or alongside Vue, React or Svelte. Try it here. Kbar is another player in this space focused more on React. Sergei Sleptsov |
| Filesize.js: Generate Human Readable Strings From File Sizes — For example, 123456 bytes could turn into Jason Mulligan |
| LunchboxJS: A Custom Vue 3 Renderer for Three.js — Straight in with a snazzy full-page demo here. The docs may prove more useful after checking it out. “Think of it like react-three-fiber for Vue.” Breakfast Studio LLC |
| Try the CI/CD Tool Used by Shopify, Pinterest, and Lyft — Join the best engineering teams running the fastest, most reliable build and deploy pipelines at scale. Now with a free plan. Buildkite sponsor |
| React-Uploady 1.0: File Upload Components and Hooks — Aims to be simple while highly customizable. You can have a file upload button, a preview, a zone for drag and drop uploads, and more. The docs are good and show off a basic example and there’s a screencast too. Yoav Niran |
| EStimator.dev: The Modern JavaScript Savings Calculator — Calculate the size improvement a site could achieve by switching to more modern JavaScript syntax. Google Chrome Labs |
| Browser Extension Template: Quickly Flesh Out a Browser Extension Codebase — Think create-react-app but for an extension, kinda. Debdut Karmakar |
| Nuxt Content v2: A Nuxt Module That Uses Markdown, YAML, CSV or JSON Files From a |