This release doesn't contain any deliberately-breaking changes. However, it contains a very complex new feature and while all of esbuild's tests pass, I would not be surprised if an important edge case turns out to be broken. So I'm releasing this as a breaking change release to avoid causing any trouble. As usual, make sure to test your code when you upgrade. Implement the JavaScript decorators p
ちょっとした React Server Component 小ネタ。 Next.js (webpack, Turbopack) で確認しているが、おそらく RSC に対応しているツールであったらどれも変わらないはず。 アプリケーションの package.json の imports セクションに以下のように記載しておく。util の部分は好きな文字列で構わないが # から始めておくこと。 { "imports": { "#util": { "react-server": "./src/util.react-server.ts", "default": "./src/util.default.ts" } } }React Server 環境とそれ以外の環境用、それぞれの実装を用意する。 とりあえず結果が異なることを確認したければ以下のような感じ。 /* ./src/util.default.
Farm⭐️ is a next-generation web build tool written in Rust. It is currently the most powerful, fastest, and most stable Rust web build tool. Since Farm open its source code of version 0.3 in March 2023, after a year of development and contributions by many community developers, version v1.0 has finally been released! The v1.0 version supports a large number of features including lazy compilation,
GitHub - samthor/kuto: Faster updates for big JS projects
🌈 Kuto makes updating your site's JS better, faster, harder, stronger. It reduces your download size by re-using code you've already shipped. Read more on the blog, or watch Theo.gg's video! 🌈 It does this by splitting JS files (in ESM) into 'main' and static parts. The static parts can be cached by clients forever, as they have no side-effects, and can be used as a 'corpus' or dictionary of cod
Kuto, a reverse JS bundler
Kuto, a reverse JS bundler Kuto is a novel approach to shipping code on the web. It lets you re-use code a client already has for shipping updates. For a 'real-world' site with ~3mb of JS, updating the React dependency resulted in: 71% smaller download 28% faster start time (on a ~5yo old phone, a Pixel 3). …vs a single bundle, or any case where all the code is invalidated. Note that Kuto works re
If you've built projects with Vite, chances are you've also used Hot Module Replacement (HMR). HMR allows you to update your code without having to refresh the page, such as editing a component markup or adjusting styles, the changes are immediately reflected in the browser, which enables faster code interation and improved developer experience. While HMR is also a feature in other bundlers like W
Gemfile での Ruby バージョンの指定を、値の直書きではなく .ruby-version からの読み込みに変更する設定です。 https://github.com/rubygems/rubygems/pull/6876 例えば、Rails アプリケーションなんかで Gemfile に .ruby-version と同じ 3.3.0 を指定しているようであれば、以下のように記述できます。 -ruby '3.3.0' +ruby file: '.ruby-version' asdf に類するものを使っているようであれば、ruby file: '.tool-versions' と記します。 https://github.com/rubygems/rubygems/pull/6898 この設定によって Ruby のアップデート時のバージョンの更新ポイントを減らすことができます。 なお、古
Vue & Vite Rustify
プロダクションで使うGo Pluginの利便性とパフォーマンス性 / Simplicity and Performance of Go plugin for Production
Announcing Vite 5
Vite 5.0 is out! November 16, 2023 Vite 4 was released almost a year ago, and it served as a solid base for the ecosystem. npm downloads per week jumped from 2.5 million to 7.5 million, as projects keep building on a shared infrastructure. Frameworks continued to innovate, and on top of Astro, Nuxt, SvelteKit, Solid Start, Qwik City, between others, we saw new frameworks joining and making the ec
はじめに Railsアプリケーション開発に必要不可欠なツールのひとつがBundlerです。 Railsを学習している人なら必ず一度はbundle installコマンドを実行したことがあるでしょう。 Railsの学習書などに従って指示されたコマンドを入力するだけなら簡単ですが、実務ではbundle install以外にも必要な知識が出てきます。 しかし、Bundlerは意外とクセがあるというか、使っているうちに徐々に「あー、そういうことね」と経験から使い方や仕様の理解が進むような印象があります。筆者の場合はそうでした。 そこでこの記事では、Rails初心者を対象に「実務でRailsを使うなら知っておくと役立つBundlerの知識」を説明します。 題して「Bundlerチョットワカルマニュアル」です！ 本記事の対象読者 本記事では以下のような読者を想定しています。 Railsアプリケーション
GitHub - farm-fe/farm: Extremely fast Vite-compatible web build tool written in Rust
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session.
こんにちは、hsbt です。前回のエントリからしばらく経ってしまい、引き続き原神や崩壊・スターレイルをプレイしつつ、アサシンクリード・ミラージュやスパイダーマン2など、ホリデーシーズンに向けたゲームラッシュでいよいよ時間がなくなってきました。 今回は RubyKaigi 2023 以降、主に 2023 年の夏から秋にかけての Ruby のフルタイムコミッタの活動についてご紹介します。 Euruko 2023 への登壇 今年の夏は Ruby 本体や RubyGems や Bundler の開発はもちろんのことですが、9月に開催された Euruko 2023 の登壇の準備が中心になりました。Euruko とはどういうカンファレンスなのかを知らない方のために簡単に紹介をします。 Ruby の国際カンファレンスには日本で開催される RubyKaigi 、米国で開催される RubyConf などがあ
フロントエンドのビルドツールが色々ありすぎて、何がどうなっているのかがわかりづらいため、 各ツールができること、特徴 ツール間がどのように依存しあっているか を一気に調べて整理した。(情報は2023/10時点) 概要 ツールの依存関係整理 上層: dev server付きのバンドラ/ビルドツール。アプリ開発者が直接configなどを書いて取り扱うのはここが多いと思われる。(Next.jsに関しては、ビルド機能に着目した場合) 下層: やや基盤的なdev serverなしのツール群。 矢印は、明示的な依存関係を表す。実際には、明示的な依存関係がなくても、下層のツール群は上層のバンドラ(やRollup)に対してプラグインを提供していることが多い。 各ツールのできること整理 ツールごとに、大まかな機能区分で、できることとできないことをまとめた。 各機能区分の定義は次セクションを参照。 ツールごと
The State of Vite Hello everyone! Welcome back to another ViteConf. Today I am here to talk about the state of Vite: What’s been happening, how things are going, and what’s going to happen next. Let’s dive right into it. Evan You ViteConf 2023
GitHub - rolldown/rolldown: Fast Rust bundler for JavaScript with Rollup-compatible API.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
Design Trade-offs in Bundler: The Rationale Behind Creating Rspack · web-infra-dev · Discussion #1
chinese version Before embarking on the development of Rspack, we explored various build tools and frameworks, including extensive use of Webpack, Vite, esbuild, and Rollup in real-world production environments. To provide some context, our team, known as the WebInfra Team, is responsible for overseeing the company's suite of front-end build tools and frameworks. Some of these are open-source, whi
When was the last time you were about to click a button on a website, only to have the page shift—causing you to click the wrong button instead? Or the last time you rage-quit a page that took too long to load? These problems are only amplified in applications as rich and interactive as ours. The more front-end code is written to support more complex features, the more bytes are sent to the browse
Runa という Ruby で Gem を使ったり複数ファイルで構成された中規模のアプリケーションを簡単に書くためのフレームワークを作っています。 Runa を作った経緯 Ruby は単独のスクリプトファイルとして実行するときは取り回しも簡単で大変使いやすい(小規模アプリケーション) が、特定の gem に依存したり複数ファイルで構成されるようなアプリケーションを作ろうとするとスタンダードな方法が用意されておらず(特に配布や共有のことを考えると)敷居が高くなってしまう(中規模アプリケーション) これが今まで余り問題にならなかったのは、Web アプリであれば Rails がその辺りも面倒をみてくれたり、コンソールアプリケーションなら gem で配布するみたいな方法でやりくりしてきた経緯がある。しかし gem で配布するには RubyGems のアカウントが必要だったり、昨今のセキュリティ問題
Two weeks ago, we launched our new JavaScript bundler in Bun v0.6.0. Today we're releasing a new feature that highlights the tight integration between Bun's bundler and runtime: Bun Macros. Macros are a mechanism for running JavaScript functions at bundle-time. The value returned from these functions are directly inlined into your bundle. As a toy example, consider this simple function that return
This is the biggest release of Bun yet. Bun now has a built-in JavaScript and TypeScript bundler and minifier. Use it to bundle frontend apps or bundle your code into a standalone executable. We've also been busy improving performance and fixing bugs as-per usual: writeFile() gets up to 20% faster on Linux, lots of bug fixes to Node.js compatiblity and Web API compatiblity, support for TypeScript
Bun.build({ entrypoints: ['./src/index.tsx'], outdir: './build', minify: true, // additional config }); Reducing complexity in JavaScriptJavaScript started as autofill for form fields, and today it powers the instruments that launch rockets to space. Unsurprisingly, the JavaScript ecosystem has exploded in complexity. How do you run TypeScript files? How do you build/bundle your code for productio
IRBとRelineのバージョンを変更してIRBを起動するスクリプトを書いた - Eggshell
IRBのバージョンは簡単に変更できるけど、Relineのバージョン変えてIRB起動するのが面倒だったのでスクリプトを書いてみた。 手元でしか使わないのでARGVで文字列渡すだけの簡素な作り。 bundler/inline は便利だなぁ。 コードにもコメントしてあるけど、ARGV.clear しないとIRBの lib/irb/magic-file.rb で ARGV[0] を File.open しようとして落ちるので ARGV.clear している。 使用例 ruby irb_reline_versions_changer.rb 1.4.1 0.3.0 #!/usr/bin/env ruby require 'bundler/inline' IRB_VERSION = ARGV[0] RELINE_VERSION = ARGV[1] # NOTE: IRBのMagicFileでARGVをフ
GitHub - web-infra-dev/rspack: A fast Rust-based web bundler 🦀️
🚀 Fast Startup: Based on Rust, the build speed is extremely fast, bringing you the ultimate development experience. ⚡ Lightning HMR: With a built-in incremental compilation mechanism, HMR is extremely fast and fully capable of developing large-scale projects. 📦 Webpack Interoperable: Compatible with the architecture and ecosystem of webpack, no need to build the ecosystem from scratch. 🎨 Batter
Rspack
Fast StartupCombining TypeScript and Rust with a parallelized architecture to bring you the ultimate developer experience.
Do you think dynamically typed interpreted Ruby language and statically typed compiled Rust language could be friends? Yes, they can! And actually, they are! Officially it all started when YJIT was ported to Rust and Ruby codebase has officially onboarded Rust code. This friendship matured when RubyGems 3.3.11 (with a new Add cargo builder for rust extensions feature) was released capable of compi
大きめのテーマです。もしかしたら「うちでは書いた JS をそのまま配信してるぜ〜」って人もいるかもしれないでが。 最近の Web フロントエンド開発では、書いた JavaScript をそのまま動かさないことが多い 最近のフロントエンド開発ではエンジニアが書いた JavaScript をそのままブラウザで動かすことはほとんどないかもしれません。 例として最近流行のフレームワークを考えてみましょう。Next.js や Remix、Nuxt.js など、いずれも内部的にトランスパイラやモジュールバンドラを使い、エンジニアが書いた JavaScript を別の形へと変換してからユーザーのブラウザで動かすような仕組みになっています。 一昔前だと Next.js のようなフレームワークが今ほど発展していなかったこともあり、webpack や Babel を直接使っていたと思いますが、それも同じです。
Ruby: GemfileとGemfile.lock究極ガイド（翻訳）｜TechRacho by BPS株式会社
概要 元サイトの許諾を得て翻訳・公開いたします。 英語記事: The Ultimate Guide to Gemfile and Gemfile.lock | Saeloun Blog 原文公開日: 2022/08/16 原著者: Keshav Biswa サイト: Saeloun Blog Ruby on Railsの開発者なら、GemfileやGemfile.lockを知らない人はいないでしょう。この2つのファイルはRuby gemをインストールするのに欠かせませんが、仕組みを知らないままでは混乱する可能性もあります。本記事では、Gemfileとは何か、その中に何があるのか、および使い方について解説します。 最初に、デフォルトのRails 7アプリケーションを作成し、それからGemfileの各行を調べて意味を理解していきましょう。 新規作成したアプリのディレクトリには、Gemfileと
Turbopack
Why Turbopack?With incremental behavior and adaptable bundling strategies, Turbopack provides a fast and flexible development experience for apps of any size. Incremental by designBuilding once is enough work—once Turbopack performs a task, it never does it again.
Introducing Turbopack: Rust-based successor to Webpack – Vercel
Vercel's mission is to provide the speed and reliability innovators need to create at the moment of inspiration. Last year, we focused on speeding up the way Next.js bundles your apps. Each time we moved from a JavaScript-based tool to a Rust-based one, we saw enormous improvements. We migrated away from Babel, which resulted in 17x faster transpilation. We replaced Terser, which resulted in 6x fa
🌕 moonでのmonorepo管理とpackemonでのCJS/ESMのdual package 🌕 moon 一貫性を持ったmonorepo管理ツール for JavaScript ハッシュを使ったファイルキャッシュ プロジェクトのパッケージ間の依存関係の分析とタスク実行 Node.js/npmパッケージマネージャーのバージョン管理と一貫性 TypeScriptのProject Referendcesの一貫性 比較 Nx: The Framework + Pluginで拡張する Lerna: Nx傘下、ライブラリ公開向け Turborepo: タスク実行の最適化をする moon: monorepoでの一貫性を提供する Packemon: moonと同じ作者。ESM/CJSのライブラリ公開向け 比較(言語) Nx: TypeScript + C++[^1] Turborepo: Go
GitHub - oven-sh/bun: Incredibly fast JavaScript runtime, bundler, test runner, and package manager – all in one
Bun is under active development. Use it to speed up your development workflows or run simpler production code in resource-constrained environments like serverless functions. We're working on more complete Node.js compatibility and integration with existing frameworks. Join the Discord and watch the GitHub repository to keep tabs on future releases. Bun is an all-in-one toolkit for JavaScript and T
はじめに Bundler 2.2.x から 適切なプラットフォームを Gemfile.lock に記載する必要があった すべての環境をすぐに用意、再現できるマシンが複数手元にないため Platform 一覧を作成した Mac OS は新しい OS が公開後更新します Platform 一覧 Linux, Mac 別に記載します 32bit 環境や Windows マシン は手元に無いため省略しています 以下に記載する Platform 名を bundle lock --add-platform <Platform名> コマンド実行時に渡すことで、実行環境の追加できます Linux OS x84_64 arm64
Component toolkit for creating live-running code editing experiences | Sandpack
import { globalStyles } from './stitches.config'; import { Section, SandpackLogo, SectionHeader, SandpackTitle, Link } from './components'; export default function App() { globalStyles(); return ( <Section> <SectionHeader> <Link href="https://sandpack.codesandbox.io/docs"> Docs </Link> <Link href="https://github.com/codesandbox/sandpack"> GitHub </Link> </SectionHeader> <SandpackLogo /> <SandpackT
Building a JavaScript Bundler
First published on April 23, 2022, updated on March 20, 2023 Jest’s packages make up an entire ecosystem of packages useful for building any kind of JavaScript tooling. “The whole is greater than the sum of its parts” doesn’t apply to Jest! In this article we are going to leverage some of Jest’s packages to learn how a JavaScript bundler works. In the end, you’ll have a toy bundler, and you’ll und
RubyのDockerイメージでよく使う環境変数
Ruby向けのDockerイメージで使いがちな環境変数について整理する。 GEM_HOME RubyGemsに対して、どのディレクトリにGemをインストールするかを指定する環境変数。例えば gem install foo を実行すると、この環境変数で指定したディレクトリにfoo gemがインストールされる。 Dockerでありがちな作戦として、/gem のような適当なパスにデータボリュームをマウントしておいて、そこにGemを永続化させておくというのがある。このときGEM_HOMEを /gem に指定しておくと、gem install bundler を実行したときそこにBundlerがインストールされ、更に /gem/bin/bundle も用意される。 BUNDLE_PATH Bundlerに対して、どのディレクトリにGemをインストールするかを指定する環境変数。例えば bundle i
Shakerphobia
analyze bundle size with treeshake
bundlephobia.com というサイトがあります。これは npm のモジュールを参照した際のバンドルサイズを算出してくれるサービスです。 便利なんですが、基本的に dist/.. 等の package.json の main で配られるものだけをターゲットにしているので、 ESM Treeshake で一部のモジュールだけ import {} from ... した際のバンドルサイズがわからない、という問題がありました。 なので、それに対応したものを自分で作りました。netlify にデプロイしてあります。 こんな感じです。 使い方 https://shakerphobia.netlify.app/?pkg=<>&imports=<a,b,c> どうやって動いてるか URL を踏むと、 cdn.skypack.dev (その実体は npm) からソースコードを落としてきて、 Web
Node.jsのNative ESM対応は夢の機能ですが、夢を詰め込みすぎたせいかCJSからの移行を難しくしているポイントが依然として存在します。そのひとつが拡張子問題で、Node.jsのNative ESMではモジュールの拡張子を明示しなければいけなくなりました。 (これはWebブラウザの挙動に近づけるための判断だと考えられます。) 特にTypeScriptと他のツール (JestやWebpack) と組み合わせて利用している状態でのNative ESM化は実質的に未解決の状態だと言えます。本稿ではこの現状についてできる範囲で状況説明を試みます。 Node.jsの拡張子の扱い Node.jsはCJSとESMの2つのモジュールフォーマットをサポートしていますが、これらは単にパーサーが異なるだけではなく、実質的には「2種類の異なるモジュールシステムがFFIで繋がっている」程度には隔たりがあり
How We Fixed the Dependency Confusion Vulnerability in Over 600 Ruby Applications
Opens in a new windowOpens an external siteOpens an external site in a new window
GitHub - DataDog/build-plugin: Track your build performances like never before.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Release v0.21.0 · evanw/esbuild
Server Component と Client Component で依存モジュールを切り替える
Release 🚀 Farm v1.0 is released! · farm-fe/farm
Hot Module Replacement is Easy - Bjorn Lu
GemfileでのRubyバージョン指定を.ruby-versionから読む - koicの日記
Rails初心者に送る「Bundlerチョットワカルマニュアル」 - Qiita
Ruby フルタイムコミッタの仕事報告 2023年Q2-3 - ANDPAD Tech Blog
JavaScriptビルドツールの整理 各ツールの機能と依存関係
State of Vite (ViteConf 2023)
How we reduced the size of our JavaScript bundles by 33%
Runa: Ruby で中規模アプリケーションを書くためのフレームワーク - ブログのおんがえし
JavaScript Macros in Bun | Bun Blog
Bun v0.6.0 | Bun Blog
The Bun Bundler | Bun Blog
Bundler: Generate gem skeleton with Rust extension
書いた JavaScript をそのまま動かすフロントエンド開発の未来のために必要なもの
🌕 moonでのmonorepo管理とpackemonでのCJS/ESMのdual package
Bundler の Platform 一覧 （Mac OS / Linux版） - Qiita
ESM treeshake に対応したバンドルサイズを計算してくれる Shakerphobia を作った
Native ESM + TypeScript 拡張子問題: 歯にものが挟まったようなスッキリしない書き流し