Tag: software

Microsoft spills the tea on TypeScript

Posted on by

#​655 — September 21, 2023

Read on the Web

JavaScript Weekly

▶  TypeScript Origins: The Documentary — You know you’ve made it when you get your own documentary! This has just dropped but is well produced, packed with stories from TypeScript’s co-creators, users, and other folks at Microsoft, and kept me entertained. It goes particularly deep into the motivations and process behind its creation, including why Microsoft felt it was worth pursuing.

OfferZen Origins

🔥 The takes get spicer 25+ minutes in as various TypeScript users chip in with their opinions, and even Daniel Rosenwasser, now program manager of the TypeScript team, says he initially worried that Microsoft might “f**k it all up.” 😅 Ryan Dahl pops up about an hour in too.. so I hope you’ve got some time spare.

Patterns for Reactivity with Modern Vanilla JavaScript — When data changes, you often want to do things, and the process that makes that happen is reactivity. While many libraries or frameworks like React or Vue offer reactive solutions out of the box, you can do it all with vanilla JavaScript too, and this post digs into many of the patterns you might need to use, complete with examples.

Marc Grabanski

Handsontable: Data Grid With Spreadsheet Superpowers — There are a lot of JavaScript data grids out there, but none are quite like Handsontable. Its Excel-like design, keyboard shortcuts, and navigation make it the perfect tool for developers.

Handsontable sponsor

Deno 1.37: Modern JavaScript in Jupyter Notebooks — Not content to let Bun take all the headlines, Deno has come up with something pretty neat here. Deno 1.37 ships with a Jupyter Notebook integration so you can create interactive REPL sessions but using the JavaScript you know and love, rather than Python.

The Deno Team

JavaScript Minification Benchmarks — A frequently updated benchmark suite and results comparing the speed and quality of JavaScript minification across a variety of tools including esbuild, Babel, Bun, SWC, and Uglify.

Hiroki Osame

⚡️ IN BRIEF:

The Svelte team offers a sneak peek at the forthcoming Svelte 5 and introduces the idea of ‘runes’: “Like every other framework, we’ve come to the realisation that Knockout was right all along.”

Happy 27th birthday to JScript! JScript was a version of JavaScript that Microsoft put into IE 3.0 primarily to avoid trademark issues around the name of JavaScript. No-one cares much about that anymore, despite Oracle still technically holding the JavaScript trademark.

Folks are discussing whether Node.js needs a mascot of its own.

Want to support anyone doing great work on JavaScript projects? You can nominate them for a GitHub Star.

If you rely upon the npm package download counts at all, the daily counts for all packages was zero on September 13 and 14 (example). Why? “This issue remains under investigation,” says npm support.

🎉 RELEASES:

Remix v2 – Popular full stack web framework.

Bun 1.0.2 – Bugfixes, faster bun –watch, it now uses V8’s Date parser, and Fastify apps now work too.

Node.js v20.7 (Current) – Multiple –env-files now supported.

Next.js 13.5 – Faster, faster, faster.

📒 Articles & Tutorials

Getting Network Activity Under Control with Priority Hints — A look at how browsers can prioritize the loading of resources, how you can explicitly specify a priority when using fetch, and how different ways of loading scripts are prioritized.

Alex MacArthur

Securing Node Apps by Analyzing Real Command Injection Examples — When code can be manipulated to run unintended, arbitrary commands, it’s never going to end well.

Liran Tal

🚀  Coming Soon: Fixed-Cost Monthly Maintenance by UpgradeJS.com — Too much tech debt in your JavaScript app? Let us help. Slow and steady upgrades at your own pace. Releasing next week.

🌳 Bonsai by UpgradeJS.com sponsor

🧭  What’s New in Safari 17 — Safari 17 is now in beta on iOS 17 with the final release dropping across all of Apple’s platforms next week. On the JavaScript front, Safari and WebKit now fully support the Storage API, WebGL in Offscreen Canvas, v flag support on regexes, Set operation methods, URL.canParse, plus the much anticipated support for PWAs in macOS Sonoma.

Jen Simmons and the WebKit team

Testing Out the Alpine.js Intersect Plugin — A wrapper for the Intersection Observer API.

Raymond Camden

▶  How to Make Forms in Angular Reusable

Decoded Frontend

Clean Layout Architecture for Vue Applications

Fotis Adamakis

Incremental Static Regeneration for Angular

Enea Jahollari

🛠 Code & Tools

fx 30: The Go(lang)-Powered Terminal JSON Viewer — Yes, it’s written in Go, but fx has long been a useful tool for looking at JSON files, and it has just been rewritten from the ground up with a new look, regex search, fuzzy search, and support for “even the most massive JSON files.” You don’t need to worry about Go at all; it’s simply a fantastic tool for looking at JSON.

Anton Medvedev

Breakpoints and console.log Is the Past, Time Travel Is the Future — 15x faster JavaScript debugging than with breakpoints and console.log, supports Vitest, jest, karma, jasmine, and more.

Wallaby.js sponsor

Mantine 7.0: The Popular React Component Library — A big release for what is now one of the most popular React component libraries. As of v7, Mantine no longer relies on Emotion and components come with native CSS files, all components now support the system-set color scheme, CSS modules are now the default way to style components, and there are many smaller enhancements too.

Mantine Team

Chrono 2.7: A Natural Language Date Parser — Give it a string like “today”, “last Friday”, “2 weeks from now”, or even an entire date and time, and it’ll come up with a date object to suit.

Wanasit Tanakitrungruang

Theatre.js 0.7: Motion Design for the Web — Can be used both programmatically or via a visual editor to animate objects created with things like Three.js, React Three Fiber, HTML/SVG, or even just tween variable values.

Theatre.js Project

Track Errors and Performance Issues in Every Part of Your Stack

Sentry sponsor

Swup: A Flexible Page Transition Library for Server-Side Rendered Sites — A library that benefits hugely from checking out the demos. v4.4 adds experimental ViewTransition support.

Georgy Marchuk

Create Chrome Extension: A Scaffolding Tool for Chrome Extensions — Similar to create-react-app or Yeoman, this is specifically for starting extension development, with support for several frameworks, HMR, and light/dark modes.

Yalda

💡 Chrome Extension CLI is another option in this space.

Neutralinojs 4.14.0 – Imagine something like Electron but without the browser engine being bundled in. Supporting Linux, Windows, and macOS, it instead leans on what’s already present.

📅 React Lite Month Picker
↳ An elegant way to let users select a specific month.

React-Virtuoso 4.6 – Powerful virtual list component.

Faker 8.1 – Generate large amounts of fake data.

🔊 Peaks.js 3.1
↳ The BBC’s audio waveform UI component.

Ember.js 5.3

💻 Jobs

Nest.js Back-End Developer — Lead the development of a HealthTech platform, focused on Caregiver support. TypeScript, Nest.js, PostgreSQL, AWS, React/Next.js.

Carallel

Find JavaScript Jobs with Hired — Hired makes job hunting easy-instead of chasing recruiters, companies approach you with salary details up front. Create a free profile now.

Hired

“The best programs are the ones written when the programmer is supposed to be working on something else.”

___
Melinda Varian

Advancing the NodeSource Node.js Package Repo (Including User-Requested Upgrades!)

Posted on by

For over a decade, NodeSource has developed and maintained a Node.js package repository that, has become the standard for production use globally. We are excited to announce some significant updates to this repo that include a large number of items related to user requests. (Note that there is an important point in the section below about using the new repo as the old repo will remain available but no longer be supported with new versions)

We handle over 100 million downloads of the open-source binaries each year, developers rely on our timely releases (fastest in the ecosystem) and tooling to simplify their use of the Node.js Runtime. Every time there is a release, including security updates, our team delivers updates in less than 48 hours.

Img 1- Type of Distributions

As part of our ongoing commitment to the ecosystem, we want to ensure that developers who rely on our repository have access to a robust and efficient resource led by our Node experts. A key objective with this update was to enhance the Node.js package distribution experience, making it more intuitive, feature-rich, and responsive to user needs. In the following sections, we’ll dive into the improvements we’ve made, highlighting the changes that promise to make your development journey easier.

Check it out HERE and let us know your thoughts!

New Features

Version Choice (Made Easy): We have added versatility with the latest update to our repository, gone are the days of being locked into the latest Node.js release. Now, you can choose the specific version of Node.js you need to tailor your environment to the unique needs of your project.

Universal distribution support: Say goodbye to server customization and compatibility concerns. Our repository now seamlessly supports all distributions. You don’t need to adjust for each new OS version, all are supported out-of-the-box.

Seamless CDN transition: We’ve revamped our CDN provider to address cache-related issues. This change ensures a smoother, more reliable experience and eliminates cache-related hiccups..

Streamlined installation requirements: Installing Node.js should be a snap. That’s why we’ve carefully configured the necessary installation requirements. The package now includes the required glibc and Python3 configurations, making the setup more accessible.

Simplified installation process: Recognizing the diversity of our user base, we’ve redesigned the installation process—no more complex scripts to decipher. Instead, we’ve streamlined it to a few simple lines of code. Installation is now easy and accessible for users of all skill levels.

These improvements demonstrate our commitment to providing a repository experience that keeps pace with technological demands and prioritizes user convenience and satisfaction.

⚠️ IMPORTANT: Use the new repository!

Failing to migrate to the new repository could be significant, most notably is the potential denial of access to the latest versions of Node.js. Because these latest versions will be distributed exclusively through the new repository, those who do not migrate will miss important updates, improvements, and features.

For more information on the new repository including details regarding the migration process, we recommend you visit the following link for the repository wiki, which provides comprehensive information on making a successful transition.

Our Distributions Journey

Our mission to help developers gain access to Node.js and enable the enterprise to adopt it safely has been a key driver for our binary distribution effort. We have seen tremendous growth in the number of downloads every year from our distributions across the globe.

Img 2- Request per Country and Data Transfer by Country per 24H

Our flagship product, N|Solid, an enterprise-grade version of the Node.js Runtime, is a testament to this devotion to OSS, and was a key part of why we created this repo that is used by millions of developers to power a massive number of applications. Our Node and Infra experts will continue to support this repo for the community with great pride.

> This repository has seen a staggering number of annual package downloads, over 120 million, and a data consumption rate of around 300 terabytes per month. This endeavor hasn’t been without its challenges, as maintaining such a repository has required extraordinary dedication and effort.

Earlier this year we made the decision to open-source our N|Solid Runtime marking a key turning point for NodeSource, inspiring us to extend our commitment to the repository. (The OSS version of N|Solid will be available in October of this year)

_> Recognizing the symbiotic relationship between Node.js and N|Solid, we decided to merge their paths. _

By distributing Node.js and N|Solid together, we’re creating a unified ecosystem that takes advantage of the power of Node combined with the advancements of N|Solid. This dynamic coupling invites those familiar with our repository to explore what we refer to as “enterprise Node.js,” or the Node.js that enterprises have been waiting for. This synergy is a testament to our commitment to both the Node.js community and the growth of enterprise-grade solutions.

Conclusion

As we embark on this transformative phase, we reflect on our journey in this ecosystem. We’ve been privileged to play a role in supporting developers and companies, and we’re excited to further enhance our collaboration.

Today, we invite you to explore our new repository, HERE, – a hub of choice and compatibility, empowering you to select the Node.js version that suits your needs. But that’s just the beginning of the story. If you are interested in our Enterprise version N|Solid it’s available to you for FREE with additional pricing packages for larger projects/teams and support.

Stay tuned for further enhancements as we refine and enrich your experience.Thank you for being a part of our journey. Here’s to many more years of collaboration and growth!

About NodeSource, Inc.

NodeSource, Inc. is a technology company completely focused on Node.js and is dedicated to helping organizations and developers leverage the power of this technology. We offer the leading APM for monitoring and securing Node.js and provide world-class support and consulting services to help organizations navigate their Node.js journey. #KnowYourNode. For more information, visit NodeSource.com and follow @NodeSource on Twitter.

N|Solid v4.10.1 is now available

Posted on by

NodeSource is excited to announce N|Solid v4.10.1 which contains the following changes:

General stability improvements and bug fixes
Node.js v16.20.2 (LTS): Includes a Node.js security release captured in Node.js v16.20.2 (LTS).
Node.js v18.17.1 (LTS): Includes a Node.js security release captured in Node.js v18.17.1 (LTS).

For detailed information on installing and using N|Solid, please refer to the N|Solid User Guide.

Changes

IMPORTANT: This release of N|Solid v4.10.1 contains a Node.js security release!

This release includes patches for these vulnerabilities:

• CVE-2023-32002: Policies can be bypassed via Module._load (High)

• CVE-2023-32006: Policies can be bypassed by module.constructor.createRequire (Medium)
• CVE-2023-32559: Policies can be bypassed via process.binding (Medium)
• OpenSSL Security Releases
OpenSSL security advisory 14th July.
penSSL security advisory 19th July.
OpenSSL security advisory 31st July

N|Solid

There are two available LTS Node.js versions for you to use with N|Solid, Node.js 16 Gallium and Node.js 18 Hydrogen.

N|Solid v4.10.1 Gallium ships with Node.js v16.20.2.

N|Solid v4.10.1 Hydrogen ships with Node.js v18.17.1.

Node.js

The Node.js 16 Gallium LTS release line will continue to be supported until September 11, 2023.

The Node.js 18 Hydrogen LTS release line will continue to be supported until April 30, 2025.

Supported Operating Systems for N|Solid Runtime and N|Solid Console

Please note that The N|Solid Runtime is supported on the following operating systems:

Windows:
Windows 10
Microsoft Windows Server 1909 Core
Microsoft Windows Server 2012
Microsoft Windows Server 2008
macOS:
macOS 10.11 and newer
RPM based 64-bit Linux distributions (x86_64):
Amazon Linux AMI release 2015.09 and newer
RHEL7 / CentOS 7 and newer
Fedora 32 and newer
DEB based 64-bit Linux distributions (x86_64, arm64 and armhf):
Ubuntu 16.04 and newer
Debian 9 (stretch) and newer
Alpine
Alpine 3.3 and newer

Download the latest version of N|Solid

You can download the latest version of N|Solid via http://accounts.nodesource.com or visit https://downloads.nodesource.com/ directly.

New to N|Solid?

If you’ve never tried N|Solid, this is a great time to do so. N|Solid is a fully compatible Node.js runtime that has been enhanced to address the needs of the Enterprise. N|Solid provides meaningful insights into the runtime process and the underlying systems. Click 👉 [HERE]

The tale of how static typing came to JavaScript

Posted on by

#​648 — July 20, 2023

Read on the Web

JavaScript Weekly

pkg-size: Find the True, Current Size of an npm Package Without Leaving Your Browser — A beautifully designed site that can show you the true size of an npm package (including dependencies) using the actual packages which are ‘installed’ in a browser-based WebContainers-powered environment. Hiroki has 🐦 a Twitter thread where he explains more about how it works.

Hiroki Osame

TypeScript and the Dawn of Gradual Types — From GitHub’s ReadME project comes a thorough journalistic take on how static typing made it into the JavaScript world, what TypeScript offers, some alternative approaches, and the possibility of adding type annotations to JavaScript iself.

Mike Melanson (GitHub)

Create a Real-Time Multi-Host Livestream with Amazon IVS — Amazon Interactive Video Service (Amazon IVS) enables developers to create dynamic video experiences, such as collaborative livestreams with multiple hosts. Click here to learn more.

Amazon Web Services (AWS) sponsor

Storybook 7.1: The Workshop for Building UI Components — v7.1 introduces in-app onboarding for your newest team members, zero-config styling support for Tailwind, MUI, styled-components and MUI, Vue 3 source snippets, and more.

Storybook Team

Five Inconvenient Truths about TypeScript — A brief dose of reality for a world seemingly obsessed with TypeScript: “If you want to get into TypeScript, don’t think you can leave JavaScript behind. It will find you, and it will get you.”

Stefan Baumgartner

🎉 RELEASES:

Fresh 1.3 – The Deno web framework. Plugins can now inject routes and middleware into apps, there’s Deno.serve support, and you can create async route components.

Downshift 8.0 – Primitives to build WAI-ARIA compliant React autocomplete, combobox & select components.

Node.js v18.17.0 (LTS) – Node 18 gets the Ada 2.0 WHATWG URL parser.

Fastify 4.20 – The fast, low overhead web Node.js framework.

⚡️ IN BRIEF:

The Promise.withResolvers proposal has progressed from stage 2 to 3 at TC39, as has the array grouping proposal, as well as source phase imports.

🗣 The folks on Hacker News discussed why the site isn’t being indundated with links to new JavaScript frameworks recently. Has React ‘won’? Has AI stolen the limelight? Or is a JavaScript revolution quietly brewing..?

👴🏻 A blog post from 1996 popped up telling us about the newest JavaScript features in Netscape 3.0 – definitely a blast from the past. Say hello to the typeof operator!

📒 Articles & Tutorials

‘How We Generate JS and Python SDKs from a Canonical Rust SDK’ — PostgresML is an extension that adds machine learning functions into Postgres. Its team loves and prefers Rust but most of its users are using JavaScript or Python. What to do? Simultaneously write multi-language libraries using Rust..

Silas Marvin (PostgresML)

💡 Psst.. if you use Postgres at all, we have a Postgres newsletter too!

Updating Code with jscodeshift — TypeORM is an ORM for Node that introduced some breaking changes requiring the author to update lots of calls in his code. A perfect time to use a ‘codemod’ to automate the job. Even if you don’t use TypeORM, this post might give you some ideas for other places to use such an approach.

Clinton Blackburn

AI-Proofing Your Career For Tomorrow: Free Session by Interview Kickstart — Discover Your AI Career Path (AI/ML vs Data Science). Take an informed decision: Insights from FAANG+ AI/ML Engineers. Register for a free session.

Interview Kickstart sponsor

How React 18 Improves App Performance — If you’ve not entirely kept up with how things have changed or developed in React with regards to concurrent rendering, transitions, Suspense, and even React Server Components, this is a fantastic review and primer to get up to speed on how React’s newer features dramatically help with performance.

Lydia Hallie (Vercel)

300ms Faster: Measures Taken to Reduce Wikipedia’s Total Blocking Time (TBT)

Nicholas Ray

On the Origins of JSX and Why It Exists

Hristiyan Dodov

🛠 Code & Tools

wavesurfer.js 7: Audio Waveform Player — If you’re creating a podcast player, audio experience, or anything where seeing an interactive audio waveform could be useful, check this out. GitHub repo.

katspaugh and contributors

TOAST UI Grid: A Customizable Grid Control for the Web — A powerful MIT-licensed grid-style control for the display, editing, and management of data. It comes from the same folks as TUI Editor and TUI Calendar and while it’s happy on its own, there are wrappers for Vue and React too. GitHub repo.

NHN

Breakpoints and console.log is the Past, Time Travel is the Future — 15x faster JavaScript debugging than with breakpoints and console.log, supports Vitest, jest, karma, jasmine, and more.

Wallaby.js sponsor

Pines: A Library of UI Components for Alpine.js and Tailwind Projects — Includes sliders, tooltips, accordions, modals, and others. The CSS-only components are usable in any Tailwind project while the ones that require JS are designed for use with Alpine.js.

devdojo

YouTube.js 5.5: A Wrapper Around YouTube’s Private API — One of those things you’d expect to be quickly blocked somehow, but it’s 18 months old, so… 😆 The fun isn’t just for Node or Deno users – it’ll work in the browser if you can proxy the requests through your own server.

LuanRT

Eruda 3.0: A Console for Mobile Browsers — If you’re in a situation where you have no access to DevTools, you can add Eruda to your page and it provides a sort of virtual devtools you can use from any browser, including on mobile.

LiriLiri

Reagraph 4.10: WebGL Graph Visualization Library for React — Here’s a basic code example. This week’s release adds support for three dimensional clustering. GitHub repo.

REAGRAPH

brotli-wasm 2.0: A Brotli Compressor and Decompressor — Covers both Node and the browser by means of WebAssembly.

HTTP Toolkit

Pacquet: A New, Experimental Package Manager for Node — From a Node.js core member, no less.

Yagiz Nizipli

Shareon 2.2
↳ Lightweight, stylish ‘share’ buttons for social networks.

Helipopper 8.0
↳ Tooltips and popovers for Angular. (Demos.)

Ink 4.3
↳ React for interactive command-line apps.

📅 React Calendar 4.4

♖ React Chessboard 4.0

💻 Jobs

Find JavaScript Jobs with Hired — Hired makes job hunting easy-instead of chasing recruiters, companies approach you with salary details up front. Create a free profile now.

Hired

🧑‍💻 Got a job listing to share? Here’s how.

🎵 Thank you for the music..

Chip Player JS: Browser-Based MIDIs, MODs and Game Music — The creator of this site has, like me, a fascination with old digital music – MIDI files, trackers, and the like. Rather than keep an old computer running, he decided to build a browser based music player for such files.

Matt Montag

P.S. If you’re looking for something specific to listen to, the music by famed Norwegian tracker Jogeir Liljedahl is well worth a try – particularly Overture or Guitar Slinger. Or how about Donkey Kong Country’s dreamy Aquatic Ambience? It’s striking how trackers managed to squeeze so much down into a few hundred kilobytes by the heavy reuse and manipulation of samples.

Announcing N|Solid v4.9.5

Posted on by

NodeSource is excited to announce N|Solid v4.9.5 which contains the following changes:

General stability improvements and bug fixes.
Node.js v16.20.1 (LTS): Includes a Rebase of N|Solid on Node.js v16.20.1 (LTS).
Node.js v18.16.1 (LTS): Includes a Rebase of N|Solid on Node.js v18.16.1 (LTS).

For detailed information on installing and using N|Solid, please refer to the N|Solid User Guide.

Changes

N|Solid v4.9.5 includes patches for this vulnerability:

CVE-2022-25883: Versions of the package semver before 7.5.2 are vulnerable to Regular Expression Denial of Service (ReDoS) via the function new Range, when untrusted user data is provided as a range.

There are two available LTS Node.js versions for you to use with N|Solid, Node.js 16 Gallium and Node.js 18 Hydrogen.

N|Solid v4.9.5 Gallium ships with Node.js v16.20.1.

N|Solid v4.9.5 Hydrogen ships with Node.js v18.16.1.

The Node.js 16 Gallium LTS release line will continue to be supported until September 11, 2023.

The Node.js 18 Hydrogen LTS release line will continue to be supported until April 30, 2025.

Supported Operating Systems for N|Solid Runtime and N|Solid Console

Please note that The N|Solid Runtime is supported on the following operating systems:

Windows:
Windows 10
Microsoft Windows Server 1909 Core
Microsoft Windows Server 2012
Microsoft Windows Server 2008
macOS:
macOS 10.11 and newer
RPM based 64-bit Linux distributions (x86_64):
Amazon Linux AMI release 2015.09 and newer
RHEL7 / CentOS 7 and newer
Fedora 32 and newer
DEB based 64-bit Linux distributions (x86_64, arm64 and armhf):
Ubuntu 16.04 and newer
Debian 9 (stretch) and newer
Alpine
Alpine 3.3 and newer

Download the latest version of N|Solid

You can download the latest version of N|Solid via http://accounts.nodesource.com or visit https://downloads.nodesource.com/ directly.

New to N|Solid?

If you’ve never tried N|Solid, this is a great time to do so. N|Solid is a fully compatible Node.js runtime that has been enhanced to address the needs of the Enterprise. N|Solid provides meaningful insights into the runtime process and the underlying systems. Click 👉 [HERE]

NodeSource, Inc. Announces AI Assistant “Adrian” for Comprehensive Analysis and Optimization of Node.js Applications and Open-Sourcing of its Augmented Node.js Runtime.

Posted on by

[Seattle, WA, June 28, 2023] — On stage at Collision Conf in Toronto, NodeSource, Inc., the leader in enterprise-grade solutions and support for Node.js, made two big announcements: the private beta of its groundbreaking AI Assistant, “Adrian,” designed to revolutionize the way developers and DevSecOps analyze, optimize, and secure Node.js applications, and that it’s open-sourcing its Node.js runtime to enable developers access to the most advanced runtime available.

NodeSource has been helping developers and organizations with the utilization of Node.js to build digital products and services for nearly a decade, most notably with its industry-leading product, N|Solid. Augmenting N|Solid’s unparalleled depth of insights and telemetry with AI gives customers a new level of context and understanding of performance and security analysis and how best to resolve issues.

The AI agent, Adrian, identifies memory leaks, poor code, security issues, and other performance problems that impact application performance and health.

“It’s like “god-mode” for Node, said Russ Whitman, CEO of NodeSource, “we give developers and DevsSecOps teams much more than telemetry and alerts; we help them identify the real issues, with context, to help them solve quickly. The cost and time savings are massive, and lets developers focus on creating new features and adding value to the organization”.

With the ever-increasing demand for scalable, efficient, and high-performing applications, Node.js developers face the constant challenge of optimizing their codebase to deliver exceptional user experiences. Adrian is an advanced AI-powered agent that provides actionable insights and suggestions, enabling teams to streamline their Node.js applications, reduce downtime, cut costs, and enhance overall user satisfaction.

“In the near future the performance of every software development team will be transformed by AI powered tools like N|solid”, offered Robert Duffy, Chief Product and Technology Officer, Drizly, an Uber company.

Key features of Adrian include:

Automated Metric Collection
Node Performance Enhancer
Intelligent CPU Profiling
Cost Calculator
Code Advisor

Sign up HERE to join the private beta and unlock the full potential of Adrian’s AI-driven insights and optimizations.

“Our AI Assistant is a major advancement to the AI features released in N|Solid last year,” noted Adrian Estrada, the VP of Engineering (and the naming inspiration for the assistant), which showcased how we could leverage the combination of our unique data insights from N|Solid, and the expertise from our team, to provide advanced solutions for our customers. With recent advancements in Generative AI, we can go significantly beyond our expectations to bring new value to our customers.”

NodeSource also has an exciting announcement for the developer community. In addition to the launch of Adrian, the company is open-sourcing its N|Solid Runtime, empowering all developers to utilize the best Node.js runtime available. This move aims to foster collaboration and innovation within the Node.js ecosystem, enabling developers worldwide to contribute to the ongoing advancement of Node.js technology.

“We strongly believe in the power of collaboration and open-source development,” added Trevor Norris, NodeSource’s Principal Architect. “By open-sourcing our runtime, we invite the community to join us in building a stronger, more efficient Node.js environment that benefits everyone. We are excited to see the positive impact this will have on the Node.js ecosystem as a whole.”

Big Announcements

The open-sourced version of N|Solid Runtime will be available with the release of Node 20 later this year.
NodeSource will also be offering a private beta program for Adrian. To sign up for early access and receive updates.

Look for more details at www.nodesource.com.

About NodeSource

NodeSource is a leading provider of Node.js application management solutions, like N|Solid, Node.js Support, and services, helping organizations successfully scale and secure their Node.js applications. Node Certified Modules (NCM) is a comprehensive tool that offers visibility, security, and governance for managing Node.js application dependencies. With its powerful features, NCM ensures that Node.js applications remain secure, reliable, and compliant with licensing requirements.

For media inquiries, please contact:
Brandi Duffy
– [email protected]

N|Solid v4.9.4 is now available

Posted on by

MPORTANT: This release of N|Solid v4.9.4 contains a Node.js security release!

NodeSource is excited to announce N|Solid v4.9.4 which contains the following changes:

General stability improvements and bug fixes
Node.js v16.20.1 (LTS): Includes a Node.js security release captured in Node.js v16.20.1 (LTS).
Node.js v18.16.1 (LTS): Includes a Node.js security release captured in Node.js v18.16.1 (LTS).

For detailed information on installing and using N|Solid, please refer to the N|Solid User Guide.

Changes

NodeSource is excited to announce N|Solid v4.9.4 which contains the following changes:

This release includes patches for these vulnerabilities:

CVE-2023-30581: mainModule.proto Bypass Experimental Policy Mechanism (High).
CVE-2023-30585: Privilege escalation via Malicious Registry Key manipulation during Node.js installer repair process (Medium).
CVE-2023-30588: Process interuption due to invalid Public Key information in x509 certificates (Medium).
CVE-2023-30589: HTTP Request Smuggling via Empty headers separated by CR (Medium).
CVE-2023-30590: DiffieHellman does not generate keys after setting a private key (Medium).

With the new action in N|Solid saved views, you can activate the tracing automatically when one or more processes cross over performance thresholds or match query parameters that you set.

N|Solid

N|Solid v4.9.4 Gallium ships with Node.js v16.20.1.
N|Solid v4.9.4 Hydrogen ships with Node.js v18.16.1.

There are three available LTS Node.js versions for you to use with N|Solid, Node.js 16 Gallium, Node.js 14 Fermium and Node.js 18 Hydrogen.

Node.js

The Node.js 16 Gallium LTS release line will continue to be supported until September 11, 2023.

The Node.js 18 Hydrogen LTS release line will continue to be supported until April 30, 2025.

Supported Operating Systems for N|Solid Runtime and N|Solid Console

Please note that The N|Solid Runtime is supported on the following operating systems:

Windows:
Windows 10
Microsoft Windows Server 1909 Core
Microsoft Windows Server 2012
Microsoft Windows Server 2008
macOS:
macOS 10.11 and newer
RPM based 64-bit Linux distributions (x86_64):
Amazon Linux AMI release 2015.09 and newer
RHEL7 / CentOS 7 and newer
Fedora 32 and newer
DEB based 64-bit Linux distributions (x86_64, arm64 and armhf):
Ubuntu 16.04 and newer
Debian 9 (stretch) and newer
Alpine
Alpine 3.3 and newer

Download the latest version of N|Solid

You can download the latest version of N|Solid via http://accounts.nodesource.com or visit https://downloads.nodesource.com/ directly.

New to N|Solid?

If you’ve never tried N|Solid, this is a great time to do so. N|Solid is a fully compatible Node.js runtime that has been enhanced to address the needs of the Enterprise. N|Solid provides meaningful insights into the runtime process and the underlying systems. Click 👉 [HERE]

Svelte 4 released

Posted on by

#​644 — June 22, 2023

Read on the Web

JavaScript Weekly

UnsuckJS: Comparing Lightweight JavaScript Options — “No build tools, no compilers, and no hassle.” It’s a table of frontend JavaScript libraries on a simple page – that’s it! But it’s a handy table, letting you see the relative popularity, size, and latest versions of libraries as diverse as Preact, bau, htmx, Hyperapp, and Mithril.

Adam Hill

Svelte 4 Released — Four years on from Svelte 3.0 comes the latest major release of the popular compile-time framework that isn’t afraid to do things its own way. If you’re new to it, hit the interactive tutorial to get a feel for things, or if you’re already a user, enjoy the v3 to v4 migration guide, overhauled site, and extra performance on offer.

Rich Harris and the Svelte Team

🤔 Claudio Holanda’s ‘Thoughts on Svelte(Kit), one year and 3 billion requests later‘ provides some interesting balance to our cheerleading.

The Complete UI Component Library For Enterprise Web Apps — A professional UI component library with power widgets like data grid, calendar, scheduler & Gantt charts. Includes API docs, guides and an unreasonable amount of demos to play with. Seamlessly integrates with React, Angular, Vue & Salesforce apps.

Bryntum sponsor

A Look at TypeScript 5.2’s New Keyword: using — using brings something akin to Python’s with context management into TypeScript by providing a way to automatically run a Symbol.dispose function when an object leaves scope. You could use this to shut down database connections, close file handles, etc.

Matt Pocock

If you’re not a TS fan, the idea behind using is also an ECMAScript proposal (currently at stage 3) called Explicit Resource Management and there’s more detail to enjoy in their examples.

The ‘Getting Started with AI’ Stack — Andreessen Horowitz (a.k.a. a16z) is a well known VC firm, but they also have an engineering team of their own that has come up with a “getting started with AI” template for JavaScript devs who want to play with modern ML technologies without too much thinking about tooling.

Li, Li, and Casado (Andreessen Horowitz)

⚡️ IN BRIEF:

The Register reports malicious actors are exploiting expired S3 buckets to inject harmful code into legitimate npm packages without needing to modify existing code.

Fresh, a Deno-first full-stack Web framework, has a new release in the shape of Fresh 1.2. There have been some concerns over its maintenance, but now there’s a new full-time maintainer, Marvin Hagemeister, and a lot of promise on the horizon. Welcome Marvin!

RELEASES:

Node.js 20.3.1, 18.16.1 and 16.20.1 – Security releases.

React Native 0.72

Nest 10.0 – Popular Node.js framework for building enterprise-grade apps.

ESLint 8.43

📒 Articles & Tutorials

Synchronizing Videos or 3D Model Rotations to Scroll Driven Animations — With just a little JavaScript, you can control 3D models and/or videos using scroll-driven animations. It’s a common effect seen on modern fashion sites.

Bramus van Damme

▶  Recreating a JS Runtime to Understand Node’s Magic — Popular speaker, educator, Microsoft MVP and Node.js core team member Erick gives a very enthusiastic talk on the latest ‘hello world’ in the JavaScript world: building a runtime 😏 Somehow, Erick manages to run through the key concepts involved in just 20 minutes.

Erick Wendel

E-Commerce Simplified — A practical guide to building your Store with Storyblok, Commercetools, and React.js.

Storyblok sponsor

Positioning Anchored Popovers — Popovers are commonly positioned relative to their invoker — but when using the new popover attribute, anchoring can be tricky as these popovers are placed in the top layer, away from the context of their invoker. Hidde looks at options to resolve this.

Hidde de Vries

▶  React Server Components in Under Seven Minutes — Looking to quickly get a basic handle on RSCs? This fast-paced video tries to bootstrap you on the subject.

CodeLit

A Visual Guide to Understanding Node’s Event Loop

Vishwas Gopinath

Where to Host Your Remix App in 2023

Jacob Paris

🛠 Code & Tools

Selecto.js: Make Elements Selectable Within a Drag Area — Let’s say you have a number of elements that represent choices, data, whatever, and you want users to be able to select a subset of them by clicking/pointing and dragging. That’s what this does. Live examples here.

Daybrush (Younkue Choi)

Tuple – The Fastest Way to Onboard New Devs — Waste hours verbally steering on Zoom? New hires learn your codebase faster with Tuple. Trusted by over 40,000 devs.

Tuple sponsor

AutoAnimate: Add Motion to Your Apps with a Single Line of Code — You can view some nice examples on the page and this can be used with React, Vue, Svelte, or just plain JavaScript.

FormKit

Toad Scheduler: In-Memory Node and Browser Job Scheduler — Provides more structure than setTimeout or setInterval and supports cron-style scheduling.

Igor Savin

Kysely: A Fluent, Type-Safe SQL Query Builder — Inspired by Knex and targeting Node, it also works in Deno and the browser and boasts a good autocompletion experience thanks to its fluent API. GitHub repo.

Sami Koskimäki

AI.JSX: A JSX-Powered AI App Framework — It’s not React, but gives a React-like feel to letting you specify how large language models, such as ChatGPT, should integrate with your app. Luckily there’s a set of tutorials.

Fixie.ai

Generate SBOMs Effortlessly with Snyk

Snyk sponsor

💡 An SBOM is a “software bill of materials” – essentially an inventory of dependencies and components that make up an application, as Liran Tal explains.

🐼  Panda CSS: Modern, Build-Time, Type-Safe CSS-in-JS — A new DX-focused CSS-in-JS approach boasting build-time generated styles and type safety out of the box. It works with Remix, Vite, Next.js, Astro, and server components.

Segun Adebayo

React Wrap Balancer 1.0: A Component for Better Displayed Title Text — A component that improves the rendering of titles by avoiding overhanging words. v1.0 is a key release that lets the component use the native CSS text-wrap property when supported.

Shu Ding

Perspective 2.3 – Data visualization and analytics component. The core is written in C++ and compiled to WebAssembly where it can be used from JavaScript.

Tesseract.js 4.1.1 – Pure JS OCR for 100+ languages. Fixes a key bug for processing images taken with iOS devices.

Shoelace 2.5
↳ Well designed, framework agnostic UI component suite.

TestCafe 3.0
↳ Node.js tool to automated end-to-end testing.

AlaSQL 4.1
↳ JS SQL database for browser and Node.

Octokit.js 2.1
↳ GitHub SDK for browsers, Node, and Deno.

💻 Jobs

Find JavaScript Jobs with Hired — Hired makes job hunting easy-instead of chasing recruiters, companies approach you with salary details up front. Create a free profile now.

Hired

🧑‍💻 Got a job listing to share? Here’s how.

AI & ML – Highlights Google I/O (Connect) – Miami

Posted on by

On May 24th, 2023, the inaugural edition of Google I/O Connect took place in Miami, USA. Google introduced this conference as an extension to engage directly with the technical community.

Note: Image courtesy of @KarolRojas90

The concept behind Google I/O Connect was to host distributed events in four different locations worldwide.

In Miami, the focus was bringing together Google Developer Experts (GDE) from North America (Canada and USA) and LATAM. Additionally, community leaders from GDG (Google Developers Groups) and Women Tech Makers, as well as contributors and collaborators, were allowed to participate. The event welcomed over 2,000 attendees and featured 51 outstanding speakers, who were Googlers responsible for delivering technical talks, workshops, and Office Hours.

Note: Image courtesy of @jcrtejada05

The event stood out for its impeccable organization, seamless execution, and strong commitment to ensuring that speakers and attendees had a remarkable experience.

What’s New in…

Without a doubt, they were the four verticals of the event:

Mobile
Web
clouds
AI

There were incredible advances that made us as developers excited to implement them into our products, but without a doubt, the one we most eagerly awaited was the __AI Lineup__.

Google AI’s Ubiquitous Influence: Reshaping Products Everywhere

Since 2017, Google has held a dominant position in artificial intelligence and modeling, particularly with NLP (Natural Language Processing). NLP is crucial in various applications, including machine translation, sentiment analysis, chatbots, and speech recognition.

However, history took an unforeseen turn with the monumental emergence of OpenAI and the project ChatGPT and the groundbreaking development of Stable Diffusion for generating images. These advancements have undeniably propelled these technologies into the public’s eyes.

Even though these concepts have already been worked on for some years, it is essential to understand the difference between AI and ML because in this same event, both in Keynote I/O and in Connect, they talk about advances in both.

Note: Sundar’s Image by The Verge – https://nsrc.io/TikTokVergeAI

AI is a powerful tool that can be used to improve the user experience, make products more efficient, and create new possibilities. Google is committed to using AI to make its products and services better for everyone. That’s why they announced integration into these products directly and more:

Android Studio Hedgehog: Android Studio Hedgehog uses AI to improve the development process for Android apps. For example, it can automatically generate code, suggest code changes, and identify potential bugs. This can help developers save time and create better apps.

Play Store: The Google Play Store uses AI to recommend apps and games to users based on their interests and past purchases. It also uses AI to surface new apps and games that users might be interested in. This can help users find the best apps and games for their needs.

Photos: Google Photos uses AI to organize, search, and edit photos. For example, it can automatically identify faces in photos and create collages and albums. It can also automatically improve the quality of photos. This can help users easily find and enjoy their photos.

Workspace: Google Workspace uses AI to improve the user experience for various tasks, such as writing emails, creating spreadsheets, and giving presentations. For example, it can suggest words while typing, automatically generate summaries of meetings, and translate documents into other languages. This can help users be more productive and efficient.

Maps: Google Maps uses AI to provide users with directions, traffic information, and other helpful information. For example, it can automatically suggest routes based on the user’s past driving habits and can provide real-time traffic updates. This can help users get around more easily and efficiently.

✨Generative AI

The main thing in all AI ads and product integrations comes from Generative AI, which, as its name says, is an artificial intelligence that can generate new content independently.

Check the Youtube Video HERE

Through Generative AI Studio, you can test and better understand the concept of Generative AI. A console tool for rapidly prototyping and testing generative AI models. You can test sample prompts, design your prompts, and customize foundation models to handle tasks that meet your application’s needs.

In Generative AI Studio, you can:

Test sample prompts.
Design your prompts.
Customize foundation models.
Convert between speech and text.

Try it HERE!

✨PaLM 2

PaLM 2, is a large language model (LLM) AI. It is a successor to PaLM, trained on a larger dataset and with a more robust architecture. This makes PaLM 2 better at a variety of tasks, including:

Natural language understanding: PaLM 2 can better understand the nuances of human language, such as idioms, sarcasm, and metaphors.
Generating text: PaLM 2 can generate more creative and realistic text, such as poems, stories, and code.
Answering questions: PaLM 2 can answer more complex and challenging questions, even if they are open-ended or strange.
Reasoning: PaLM 2 can better understand and reason about the world by making inferences and drawing conclusions.

PaLM 2 can implement Personal assistants, Educational tools, or Creative tools. But PaLM 2 is a series of models that includes the following:

Gecko, Otter, Bison, and Unicorn are four versions of PaLM 2, or Pathways Language Model 2. They differ in size, performance, and intended use cases.

Gecko is the smallest version of PaLM 2, with 1.2 billion parameters. It is designed to be lightweight and efficient, making it suitable for mobile devices and other resource-constrained environments.
Otter is a mid-sized version of PaLM 2, with 137 billion parameters. It balances size and performance well, making it suitable for various applications.
Bison is a large version of PaLM 2, with 540 billion parameters. It is the most potent version of PaLM 2, and it is designed for demanding tasks such as natural language understanding, generating text, and answering questions.
Unicorn is the giant version of PaLM 2, with 1.5 trillion parameters. It is still under development but is expected to be the most powerful LLM ever created.

Which version of PaLM 2 is correct for you depends on your specific needs. Gecko is a good choice if you are looking for a lightweight and efficient model for mobile devices. If you are looking for a model that is a good balance between size and performance, Otter is a good choice. Bison is a good choice if you are looking for a powerful model for demanding tasks. Unicorn is a good choice if you are looking for the most powerful LLM ever created.

But soon, Google will be in the release of a more sophisticated model called Gemini; What is coming is unimaginable if we count that in this project, the researchers from Google Brain and Google DeepMind come together.

At the moment, you can join the MakerSuite waitlist to experiment with the PaLM 2 API: https://makersuite.google.com/waitlist and read the API documentation: https://developers.generativeai.google /tutorials/setup

✨Bard – AI-Chatbot (http://bard.google.com) + 🎨 Bard + Adobe Firefly

Bard an impressive AI chatbot meticulously crafted by Google. As a sophisticated conversational AI, Bard is a large language model designed to be informative and comprehensive. Trained on an immense corpus of text data, Bard can communicate and generate human-like responses across various prompts and inquiries. Whether you seek factual summaries or immersive storytelling, Bard is primed to deliver. Bard is still under development but Is learning new things every day.

Adobe Firefly is a remarkable generative AI, harnessing the power to bring visual concepts to life based on textual descriptions. When paired with Bard, the possibilities for creativity and expression become boundless. This tool can create everything from marketing materials to personal projects. For example, you could use Bard to generate a text description of a product and then use Adobe Firefly to create an image of that product. Or, you could use Bard to generate a poem and then use Adobe Firefly to create an image representing the poem. The possibilities are endless.

Note: Please note that Bard + Adobe Firefly are still in beta, so there may be some bugs or limitations. Check the review of this amazing tool, HERE

As a delightful bonus, thanks to Bard, leveraging generated content between Gmail and Google Docs becomes effortless. Additionally, Colab’s growing relevance makes it an ideal platform for code-centric projects, ensuring enhanced productivity and collaboration.

Here are some of the benefits of these new developer features in Bard:

More precise code citations can help to build a more collaborative and respectful community of developers.
Exporting to Replit can make it easier for developers to collaborate on code and share their work with others.
A dark theme can make reading easier in low-light conditions and reduce eye strain.
Integration with various Google apps and services can make it easier for users to get things done.
Connection with external services and partners can offer users various possibilities.
Generative AI capabilities can help users to create unique visuals and automate data classification.

Vertex AI

Vertex AI is a managed machine learning (ML) platform that helps you build, deploy, and scale ML models faster and easier. It provides a unified experience for managing all aspects of the ML lifecycle, from data preparation to model training and deployment. Vertex AI also includes various tools and services that can help you improve the performance and accuracy of your ML models. It is built on the Google Cloud Platform and integrates with a wide variety of open-source ML frameworks, including TensorFlow, PyTorch, and scikit-learn. This integration allows you to use the tools and libraries you already know.
Try it here: https://cloud.google.com/vertex-ai/.

Project Tailwind

Project Tailwind is a new initiative focused on developing ways to use large language models (LLMs) to create more engaging and informative user experiences. One of the critical goals of Project Tailwind is to make it easier for developers to use LLMs in their applications. To do this, Project Tailwind is developing several tools and resources, including:

A new LLM framework is designed to be easy to use and scale to large datasets.
A new API that allows developers to interact with LLMs more naturally.
A new set of tools that help developers to debug and optimize their LLM applications.

Project Tailwind is an experimental project that still needs a public URL or GitHub repo. However, you can sign up for the waitlist to be notified when it becomes available. The waitlist is available here: https://tailwind.withgoogle.com/.

MediaPipe

Google’s partnership with MediaPipe is a significant step forward in the development of ML solutions. By providing modular and customizable solutions.

Project Gameface is an excellent example of the potential of ML. This project uses facial landmark detection to create a virtual avatar that can be used to play games. This is just one example of how ML can be used to improve our lives.

If you are looking to develop an ML application, check out MediaPipe.
You can use Mediapipe for Face detection, Hand tracking, or Object detection.

TensorFlow Overview: What’s New?

Here are some of the new features and improvements that were announced:

KerasCV and KerasNLP: These new APIs make building and training state-of-the-art models for computer vision and natural language processing tasks easier.

DTensor: This new library does training and scaling large models on distributed hardware easier.

JAX2TF: This new tool makes it easier to port models written with the JAX numerical library to TensorFlow.

TF Quantization API: This new API makes making TensorFlow models more efficient and cost-effective easier.

Web ML Hub: This new web-based platform makes building and deploying machine learning models in the browser easy.

To begin your exploration, visit https://ai.google/build/machine-learning/ and immerse yourself in a wealth of invaluable resources. This platform serves as your gateway to learning, providing a comprehensive collection of tools and insights that will empower you to apply machine learning to your projects.

Whether you are a beginner or an experienced practitioner, the knowledge and expertise shared on this platform will guide you through every step of your journey. Gain a deeper understanding of the underlying principles, familiarize yourself with cutting-edge tools, and access practical examples that showcase the technology in action.

Google I/O Connect

The Google I/O Connect event in Miami was a great success. It was a great opportunity to learn about the latest Google technologies, and it was also a chance to meet some of the leading experts in the field.

One of the event’s highlights was the chance to meet Dale Markowitz, a renowned figure in artificial intelligence. Markowitz is a Senior Research Scientist at Google AI and one of the leading experts on natural language processing. She was very generous with her time and happy to answer the attendees’ questions.

Google I/O Connect event allowed me to:

Learn about the latest Google technologies
Meet leading experts in the field
Get your questions answered by Google experts
Network with other developers
Get inspired and motivated to build great things

If you are a developer, I highly recommend attending a Google I/O Connect event. It is a great way to learn, grow, and connect with other developers. You can find upcoming events on the Google Developers events page or explore Google I/O Extended events near you to connect with the community.

Related Articles:

Google I/O 2023: Making AI more helpful for Everyone by Sundar – nsrc.io/45SJOqm
Google I/O Program, Codelabs, Workshops: https://io.google/2023/program/
Techcrunch – Google I/O 2023 is a wrap — here’s a list of everything announced – nsrc.io/43TA3Xr
Google I/O 2023 Highlights: Unveiling Google’s Latest Innovations and Improvements – https://nsrc.io/3WWF9zD
The Verge – Google I/O 2023: all the news from Google’s big developer event – nsrc.io/3MWHiqz
BusinessPost – 15 Exciting Highlights from Google I/O 2023 – nsrc.io/3NhF2eW

Bundle-time macros with Bun

Posted on by

#​641 — June 1, 2023

Read on the Web

JavaScript Weekly

JavaScript Macros in Bun — Not content with giving the JavaScript world a brand new bundler, Bun’s Jarred has taken it a bit further: ‘macros’ that run at bundle time with the result being directly inlined into your code. They use stage 3 annotated import statements (so may become regular JS eventually) and Jarred shows off some use cases here.

Jarred Sumner

▶  Discussing the Future of React with Two Core Team Members — As part of the celebrations around React’s 10th birthday, Vercel’s Delba de Oliveira interviewed Andrew Clark and Sebastian Markbåge of the React core team on modern topics including server components, Suspense, Actions, and the next steps React will take.

Delba de Oliveira (Vercel)

URL Validation 101 — with Snyk — Keep script injection and server side request forgery out of your JavaScript applications with Snyk.

Snyk sponsor

Aimless.js: The ‘Missing’ JavaScript Randomness Library — If you’ve been itching for functions to give you random characters, numbers from custom distributions, random sequences, random items, weighted random numbers, or more, this is for you.

Christopher Cavalea

⚡️ IN BRIEF:

???? Two big birthdays in the past week: Node.js turned 14 and React turned 10.

Intel and Google have been working together on the Compute Pressure API which you can use, in origin trial, in Chrome 115. It provides a way to measure the ‘computational strain’ of the system your code is running on to then adjust how your app operates accordingly.

???? Misko Hevery, creator of Angular and now Qwik, was on the Stack Overflow Podcast talking about ▶️ how he’s ‘dehydrating the Web’ in an ongoing quest for higher performance.

‘Deferring Module Evaluation’ is a TC39 proposal for basically being able to lazily load modules which are executed only upon use.

You can now use Node.js built-in modules on Deno Deploy, making it easier to run existing JS apps ‘at the edge’ on their platform.

Tom Preston-Werner, GitHub co-founder and Redwood co-creator, writes about how Redwood is going ‘all in on React Server Components’ and announces the first Redwood conference this September.

SupportsCSS: Feature Detection for Modern CSS — Inspired by Modernizr, this script expands on the capabilities of CSS’s @supports feature by adding classes to your HTML and exposing a results object so you can run custom tests live in the browser.

Stephanie Eckles

????  JSDayIE 2023: The First JavaScript Conference in Ireland Is Back! — Join us on September 26th in Dublin to experience everything the Irish JavaScript community and Ireland have to offer.

JSDayIE sponsor

RELEASES:

Electron 25 – Now offering a Chrome-powered net.fetch (as opposed to Node’s flavor of fetch()).

Neutralinojs 4.12 – Desktop app dev framework.

Parcel 2.9

Bootstrap 5.3.0

node-oracledb 6.0

???? Articles & Tutorials

How to Draw Any Regular Shape with Just One JavaScript Function — Mozilla/MDN has a (relatively) new blog — here they share how to use JavaScript to draw any regular shape to a HTML canvas with a single function, and how to modify it to draw multiple shapes.

Ruth John

Sharing WebSocket Connections between Tabs and Windows — If your users open your app in multiple tabs or windows, being able to share a WebSocket connection could be a lot more efficient both at the client and server end. Is it possible? With SharedWorkers (supported by all major browsers, except Chrome on Android), you can.

Szymon Chmal

▶  How React Works Under The Hood: 2023 Edition — Quite a lot of depth for a mere 13-minutes. Covers React broadly, along with the pros and cons of JSX, how the virtual DOM approach works, plus React’s diffing algorithm.

FrontStart

Connected APM and Infrastructure Monitoring at Up to 1/3rd the Cost of Datadog

New Relic sponsor

Why Does a Farmer Emoji Have a Length of 7 in JS? — This is a nicely accessible introduction to a topic that often causes confusion. Get ready to learn a little about grapheme clusters, scalars, and code units.

Evan Hahn

The Evolution of React APIs and Code Reuse — An exploration of common React patterns, from mixins and higher-order components to render props & hooks.

Rem / Frontend Mastery

▶  ‘I Tried 8 Different Postgres ORMs’ — A modern, fast-paced, and slightly irreverent look at working with Postgres from back-end JavaScript runtimes. (9 minutes.)

Beyond Fireship

Automatically Unsubscribe from RxJS Observables in Angular Components

Rob Bell

Deploying Vanilla Node.js Apps on Fly.io

Sam Ruby (Fly)

Asynchronous JavaScript for Beginners

Daniel Agantem

???? Code & Tools

Svelvet: A Svelte Component Library for Interactive Node-Based Diagrams — You can create flow diagrams using pre-built components with seamless zooming and panning, draggable interactivity, customizable edges/nodes, etc.

Svelvet Team

Inkline 4.0: A Customizable Vue.js 3 UI/UX Library — A design system and numerous customizable components designed for mobile-first (but desktop friendly) and built with accessibility in mind.

Alex Grozav

Handsontable: Data Editor for React — There’s a lot of JS data grids out there, but none quite like Handsontable: Excel-like design, keyboard shortcuts, and React support make it the perfect data editor for web apps.

Handsontable Data Grid sponsor

JECS: An Entity Component System (ECS) for JS — Entity component systems are common in game development as they provide a lot of flexibility for managing the many objects present in games.

Stuhl

Color Names: A Gigantic List of Handpicked Color Names — At first, I thought this was just going to be a hundred or so obvious choices like the named colors in HTML (???? rebeccapurple) but it’s actually over 30,000 colors with a fantastic array of names and uses, plus JavaScript functions to work with them.

David Aerne

fastgron: High-Performance JSON to GRON Converter — ‘gron’ is a transpiled form of JSON into individual assignment operations which makes it easier to grep. (fastgron is itself written in C++.)

Adam Ritter

Orama 1.0.3
↳ In-memory, typo-tolerant, text search engine.

Perspective 2.2
↳ WASM-powered high-perf data visualization component.

Javet 2.2 – Java + V8. Embed JS into Java.

OverlayScrollbars 2.2 – JS custom scrollbar plugin.

html-react-parser 4.0 – HTML to React parser.

Vuetify 3.3.2 – Vue component framework.

React Slider 10.2 – Demos.

???? Jobs

Find JavaScript Jobs with Hired — Hired makes job hunting easy-instead of chasing recruiters, companies approach you with salary details up front. Create a free profile now.

Hired

????‍???? Got a job listing to share? Here’s how.

????  Live-streaming from JavaScript

JSFiddle: Did You Know You Can Stream on Twitch from JavaScript? — This is an interesting experiment, but I tried it and it worked! Twitch added support for WebRTC ingestion a while ago and this CodePen example ties that together with fewer than 50 lines of JavaScript to send your preferred video source to the popular livestreaming service. It’s hardly OBS, but I imagine someone will rustle up something fancier with this approach in time.

Sean DuBois on JSFiddle