Upgrade DuckDB-Wasm di CF Pages

Mengatasi ukuran file melebihi batas

Sore ini, pustaka @duckdb/duckdb-wasm diperbarui. Versi anyar ini sudah lama saya tunggu-tunggu karena memungkinkan penggunaan ekstensi duckdb penting seperti JSON dan spatial.

Saya upgrade npm. Bisa berjalan di lokal.

Naas, ketika deploy ke Cloudflare Pages, saya mendapat:

19:40:41.898	✘ [ERROR] Error: Pages only supports files up to 26.2 MB in size
19:40:41.898	
19:40:41.898	  _app/immutable/assets/duckdb-eh.ee0056b2.wasm is 33.3 MB in size

File .wasm melebihi batas ukuran yang diperbolehkan oleh Cloudflare.

Di file duckdb.js SvelteKit saya coba muat duckdb dengan:

import * as duckdb from 'https://cdn.jsdelivr.net/npm/@duckdb/[email protected]/+esm'

Yang ternyata tak diperbolehkan:

|- Error: Cannot find module 'https://cdn.jsdelivr.net/npm/@duckdb/[email protected]/+esm'

Saya utak-atik file +page.svelte, mencoba cara di REPL ini, juga tak berhasil.

Akhirnya, saya ke GH Actions duckdb-wasm, lalu mengunduh berkas duckdb-wasm-packages dari artefak. Buka direktori duckdb-wasm, hapus semua file .wasm yang berukuran besar, lalu npm pack. Unggah pustaka ke Cloudflare R2, lalu instal.

"@duckdb/duckdb-wasm": "https://storage.sekuel.com/duckdb-duckdb-wasm-1.28.1-dev91.0.tgz",

Coba jalankan di lokal, berhasil. Deploy ulang ke CF Pages, sukses!

Begini isi file duckdb.js yang saya pakai untuk inisiasi DuckDB-WASM:

import * as duckdb from '@duckdb/duckdb-wasm';

const initDB = async () => {
	const JSDELIVR_BUNDLES = duckdb.getJsDelivrBundles();

	// Select a bundle based on browser checks
	const bundle = await duckdb.selectBundle(JSDELIVR_BUNDLES);

	const worker_url = URL.createObjectURL(
		new Blob([`importScripts("${bundle.mainWorker}");`], { type: 'text/javascript' })
	);

	// Instantiate the asynchronus version of DuckDB-wasm
	const worker = new Worker(worker_url);
	const logger = new duckdb.ConsoleLogger();
	const db = new duckdb.AsyncDuckDB(logger, worker);
	await db.instantiate(bundle.mainModule, bundle.pthreadWorker);
	URL.revokeObjectURL(worker_url);
	return db;
};

export { initDB, duckdb };