こんにちは！Next.jsの最新仕様と追いかけっこ、Mizutani(@sirycity)です。行き着く先に何があるのか

今日はそんなNextの最新仕様に関するお話。

Turbopackとは

簡単に言うとめっちゃ早いwebpackです。nextではv13から導入されました。今までnext devとしていたところをnext dev --turboとするだけでOKです。まあそのうちデフォルトの挙動になるんじゃないかと思います。

ちなみにwebpackやviteと違ってnextでしか使えません(今のところは)

利点

触ってみれば分かりますが爆速も爆速です。今後もっと早くなるんでしょう。開発者体験の方のDX爆上げです。…まあホットリロードはそんなに変わんないんですが、初速は格段に早くなります。

あとターミナルが派手になります。そんくらいかな。ちなみにビルドが早くなるわけじゃないです。

Braveブラウザについて

Chromium系のブラウザです。web3とかブロックチェーンとか暗号資産とか、いわゆるキラキラしているブラウザです。使っといてなんですがそれ以上の評価はあんま思いつかない。ただ広告ブロックは便利です。この点はまじでおすすめ。

こいつらの相性が悪い

んでこっからが本題ですが、Turbopackで立てたlocalhostをBraveで開くとバグります。以上。

Loading no working with turbopack

見ての通り、有効な解決策もなさそうです。…んで、まじでこんだけの記事なんですがいかんせん情報が少ないし↑のissueも調べるのだいぶ時間がかかったので同じ轍を踏む人が出ないように投稿しました。共有知ってやつです。

対策

他のブラウザで開くだけです。ただ"open 'http://localhost:3000' && next dev --turbo"みたいに自動でブラウザ開く設定にしているとだるいですね。しかしどうしようもありません。

さいごに

余談ですが僕はブラウザ難民のためこんな理由でBraveから乗り換えたくなりました。何にしようかな。最近のEdgeとか面白そうですね。以上。