Dive Into the World of DuckDB-Wasm: A Step-by-Step Guide

Jan 7, 2023 | Programming

Welcome to the exciting realm of DuckDB-Wasm! A brilliant fusion of the powerful DuckDB SQL OLAP Database Management System with the capabilities of WebAssembly, DuckDB-Wasm allows you to leverage the strength of DuckDB directly within your browser. This guide will provide you with everything you need to get started, from installation to troubleshooting.

What is DuckDB-Wasm?

At its core, DuckDB-Wasm extends DuckDB’s functionalities to every browser. It understands Arrow, and can read different file formats like Parquet, CSV, and JSON, utilizing Filesystem APIs and HTTP requests. It has been rigorously tested for compatibility across major browsers such as Chrome, Firefox, and Safari, as well as Node.js. Intrigued? Learn more from the VLDB publication or catch the highlights from the recorded talk.

How to Install DuckDB-Wasm

Ready to try out DuckDB-Wasm? Follow these simple steps:

  1. Visit the jsDelivr stats page for the latest version.
  2. To install DuckDB-Wasm via npm, you can run the following command:
  3. npm install @duckdb/duckdb-wasm
  4. To check if your installation was successful, you can view the package on npm.

Understanding DuckDB-Wasm Code: An Analogy

Imagine you need to prepare a delicious meal. DuckDB-Wasm acts as your kitchen, equipped with all necessary utensils and ingredients. The installation step is akin to stocking your kitchen (installing the library) with pots, pans, and spices (dependencies). When you prepare a meal (execute queries), DuckDB-Wasm helps you mix everything in the right amounts, ensuring the dish turns out perfectly. Just like in cooking, where the right measurements and methods are crucial, the same applies when working with DuckDB-Wasm for efficient query execution.

Using DuckDB-Wasm with Extensions

To enhance your DuckDB-Wasm experience, you may want to load specific extensions.

-- Explicitly load extensions
LOAD icu;

You can also configure autoloading by using relevant functions or settings. For example, when reading a JSON file:

FROM read_json('https://some.url/file.json');

Building DuckDB-Wasm from Source

If you are interested in building DuckDB-Wasm from source, follow these steps:

  1. Clone the DuckDB-Wasm repository:
  2. git clone https://github.com/duckdb/duckdb-wasm.git
  3. Navigate into the directory:
  4. cd duckdb-wasm
  5. Initialize submodules:
  6. git submodule init
  7. Update submodules:
  8. git submodule update
  9. Make and apply patches:
  10. make apply_patches
  11. Serve the application:
  12. make serve

Troubleshooting Common Issues

If you encounter issues while using DuckDB-Wasm, here are some troubleshooting tips:

  • If you cannot load the library, ensure that you’re using the latest version from the relevant npm package page.
  • Check your browser compatibility; it works best on Chrome, Firefox, Safari, and Node.js.
  • For issues related to loading extensions, make sure you have the correct permissions and URL endpoints for your JSON and other resources.
  • If nothing resolves the issue, join the community on Discord for more personalized support.

For more insights, updates, or to collaborate on AI development projects, stay connected with fxis.ai.

Diving Deeper into DuckDB-Wasm’s Structure

The DuckDB-Wasm repository contains several subprojects:

  • [duckdb_wasm](lib) – Wasm Library (C++)
  • [@duckdb/duckdb-wasm](packages/duckdb-wasm) – TypeScript API
  • [@duckdb/duckdb-wasm-shell](packages/duckdb-wasm-shell) – SQL Shell (Rust)
  • [@duckdb/duckdb-wasm-app](packages/duckdb-wasm-app) – GitHub Page (TypeScript)
  • [@duckdb/react-duckdb](packages/react-duckdb) – React Hooks (TypeScript)

At fxis.ai, we believe that such advancements are crucial for the future of AI, as they enable more comprehensive and effective solutions. Our team is continually exploring new methodologies to push the envelope in artificial intelligence, ensuring that our clients benefit from the latest technological innovations.

Stay Informed with the Newest F(x) Insights and Blogs

Tech News and Blog Highlights, Straight to Your Inbox