TNS
VOXPOP
As a JavaScript developer, what non-React tools do you use most often?
Angular
0%
Astro
0%
Svelte
0%
Vue.js
0%
Other
0%
I only use React
0%
I don't use JavaScript
0%
Frontend Development / JavaScript / Rust / TypeScript

Why ChatGPT Shifted From Next.js To Remix: Some Theories

The frontend development community was all abuzz this week about OpenAI shifting off Next.js to Remix. We summarize the best analysis.
Sep 14th, 2024 8:05am by
Featued image for: Why ChatGPT Shifted From Next.js To Remix: Some Theories
Image by Diana Gonçalves Osterfeld.
The frontend development community was all abuzz about OpenAI shifting off Next.js to Remix. We’re not sure who broke the news but numerous sources confirmed it with the source code.

There’s no shortage of opinions on YouTube, LinkedIn and Medium, not to mention other social media discussions, about the shift.

But those looking for insights might want to read Alex Anderson’s post, “Oops, I accidentally made our website faster by switching to Remix,” which coincidentally published Sept. 3.

Anderson is a senior software engineer with digital agency Echobind. The company didn’t so much decide to leave Next.js as it decided to shift hosting off Vercel to Railway for cost and convenience.

“This presented us with a small problem: Next.js,” Anderson wrote. “It pairs wonderfully with Vercel, but requires a bit more setup and infrastructure to run well when self-hosted.”

Anderson’s team decided to try Remix. He found the migration was not as hard as he’d anticipated, although there were a few Next.js conveniences that he had to work around with Remix. However, when it was all said and done, he found he’d improved the site’s performance substantially.

A screenshot of Echobind's site performance on Next.js versus Remix. It shows Remix improved site scores across the board;

Echobind’s site performance on Next.js versus Remix. Screenshot Echobind’s blog.

“Then we tested it on ahrefs, to make sure all of our links and SEO juice was still good,” he wrote. “We were shocked to find our health score go up by 3% to 98%, our internal URLs with errors count go down by 94 to 11, and shockingly the number of oversized images dropped from 96 to 2.”

Rust-Based Rspack Releases Build Tool

The creators of Rspack, a rebuild of webpack that’s based on Rust, are back with a new open source offering called RSbuild. It’s a build tool that’s built on top of Rspack.

“For the webpack ecosystem, we discovered a sad fact: The webpack ecosystem lacks a build tool that is easy to use and well maintained,” the team wrote in its Tuesday announcement introducing Rspack. “The tool should be as user-friendly as CRA and Vue CLI, fully meet the needs of CSR application development, and have features such as fast startup and plugin support similar to Vite.”

The team focused on two possible uses:

  1. Creating a lightweight build tool that helps developers set up web applications with out-of-the-box support for CSR applications.
  2. Creating a shared infrastructure by providing a JavaScript API and a plugin API for higher-level tools and frameworks, so that developers can build their own tools or frameworks on top of Rsbuild.

“We designed Rsbuild with an easy-to-use, TypeScript-friendly API and a set of carefully designed configurations to fully leverage the Rspack’s build performance while reducing configuration complexity and high up-front costs,” the team wrote. “Rsbuild 1.0 provides several advanced features for the development of enterprise applications and higher-level tools, such as the multi-environment build API, SSR API, plugin API, Module Federation support and library build (Rslib).”

There are already more than 50 Rsbuild plugins available, including some that offer advanced features “to support the development of production-grade applications, such as type checking, compatibility checking and static assets retry,” the team added.

Rspack is now available as version 1.0, which released in August.

TypeScript Releases 5.6 Improves Safety

TypeScript 5.6 was released Monday. There are so many updates that Daniel Rosenwasser, the Microsoft principal product manager who leads TypeScript, included a table of contents with his blog post about the release, which links to each update.

He started with what this release updates from the beta, which includes renaming several new types. For instance, a single type BuiltinIterator, which was used to describe every value backed by Iterator.protoype, is now called InteratorObject and has a different set of type parameters, as well as several subtypes, wrote Rosenwasser.

“TypeScript 5.6 brings significant improvements in code safety, build efficiency and diagnostics responsiveness.”
— The Onix React team

The release also reverts a change around how TypeScript’s language service searched for tsconfig.json files, Rosenwasser wrote. The problem was that the language service would open up many referenced projects while looking for every possible file named tsconfig.json. The team hopes to figure out why and offer the behavior in version 5.7.

The release also adds a new flag for --build mode called –-stopOnBuildErrors.

“When a project builds with any errors, no other projects will continue to be built,” Rosenwasser wrote. “This provides something close to the behavior of previous versions of TypeScript since TypeScript 5.6 always builds in the face of errors.”

Many of the features emerging from the beta have been reviewed online. Beyond the release notes, developers will find a breakdown of the new features in this analysis of the beta release by Onix React, a team of React and React Native specialists.

“TypeScript 5.6 brings significant improvements in code safety, build efficiency, and diagnostics responsiveness,” the team wrote. “These updates help developers catch errors early, work more efficiently with iterables, and maintain productivity during large-scale builds. … The new features not only streamline the development process but also provide robust tools to prevent common programming errors, making TypeScript an even more powerful tool for developers.”

JavaScript YouTuber Theo Browne also published a review of the TypeScript 5.6 updates this week.

Work for version 5.7 is already underway.

Migration Guide for HTMX 2.0

HTMX is a JavaScript library that lets developers add interactivity to HTML pages without writing traditional JavaScript code. It can trigger behaviors like AJAX requests, updating the DOM and handling events through a set of attributes added to the HTML elements.

Version 2.0.2 was released in August. This week, software engineer Antonello Zanini wrote a sort of primer on the new HTMX release on OpenRelay’s blog. OpenRelay is an open source replay tool.

The post walks through updates to HTMX, such as:

  • HTTP DELETE Request Parameter Handling, so HTMX now complies with an HTML specification;
  • Extension migration;
  • Support for web components;
  • A new New swap() API; and
  • Several attribute deprecations.

Zanini also provides a handy migration guide for those moving to version 1 to version 2, along with links to the HTMX discord server.

Group Created with Sketch.
TNS DAILY NEWSLETTER Receive a free roundup of the most recent TNS articles in your inbox each day.