JavaScript Spreadsheet Component

Used by the world's leading companies

Create a JavaScript Spreadsheet in Two Minutes

Install with the wizard, which sets up everything for your project:

npx @jspreadsheet/install

Or install manually:

npm install jspreadsheet

Then create your first spreadsheet, no framework required:

import jspreadsheet from "jspreadsheet";
import "jspreadsheet/dist/jspreadsheet.css";
import "jsuites/dist/jsuites.css";

// Get a free 30-day trial certificate at jspreadsheet.com
jspreadsheet.setLicense('MGZmZDIxOGE4MzFkNTI5MWJkMDAyMzliMmE3YTY2OGUyMjY1MDEyZDk4YjVhYzEyOThhNDY3M2UzYWZlNTNjMGExMzNkNTQxOGMxYThhOTY3MjAxYWZjZTAyMDg5ODI3ODI2N2MxY2MzZjIwZGFhNzg0OTBlM2M1ODk3MDkwYTIsZXlKamJHbGxiblJKWkNJNklpSXNJbTVoYldVaU9pSktjM0J5WldGa2MyaGxaWFFpTENKa1lYUmxJam94TnpnMk56YzBPVFk1TENKa2IyMWhhVzRpT2xzaWFuTndjbVZoWkhOb1pXVjBMbU52YlNJc0ltTnZaR1Z6WVc1a1ltOTRMbWx2SWl3aWFuTm9aV3hzTG01bGRDSXNJbU56WWk1aGNIQWlMQ0p6ZEdGamEySnNhWFI2TG1sdklpd2lkMlZpWTI5dWRHRnBibVZ5TG1sdklpd2liRzlqWVd4b2IzTjBJbDBzSW5Cc1lXNGlPaUl6TkNJc0luTmpiM0JsSWpwYkluWTNJaXdpZGpnaUxDSjJPU0lzSW5ZeE1DSXNJbll4TVNJc0luWXhNaUlzSW1Ob1lYSjBjeUlzSW1admNtMXpJaXdpWm05eWJYVnNZU0lzSW5CaGNuTmxjaUlzSW5KbGJtUmxjaUlzSW1OdmJXMWxiblJ6SWl3aWFXMXdiM0owWlhJaUxDSmlZWElpTENKMllXeHBaR0YwYVc5dWN5SXNJbk5sWVhKamFDSXNJbkJ5YVc1MElpd2ljMmhsWlhSeklpd2lZMnhwWlc1MElpd2ljMlZ5ZG1WeUlpd2ljMmhoY0dWeklpd2labTl5YldGMElpd2ljR2wyYjNRaVhTd2laR1Z0YnlJNmRISjFaWDA9');

jspreadsheet(document.getElementById('spreadsheet'), {
    worksheets: [{
        data: [
            ['Mazda', 2001, 2000, '=B1*C1'],
            ['Peugeot', 2010, 5000, '=B2*C2'],
            ['Honda Fit', 2009, 3000, '=B3*C3'],
        ],
        columns: [
            { title: 'Model', width: '250px' },
            { title: 'Year', width: '100px' },
            { title: 'Price', width: '100px' },
            { title: 'Total', width: '120px' },
        ]
    }]
});

That is a complete Excel-like JavaScript spreadsheet: editable cells, live formulas, keyboard navigation, and copy and paste from Excel. It works with plain script tags, Vite, webpack, or any stack, and official wrappers exist for React, Vue, and Angular. The getting started guide explains every configuration option.

Proven Solution, Backed by Users

In their own words: How teams saved hours and reduce rework.

What Our Customers Are Saying

Jspreadsheet reduces our customers' development time. Here are some of their experiences.

"At SplitC we struggled sometimes when users wanted to bulk insert/edit things (sometimes over 100k rows) and we needed performance. Jspreadsheet is probably the fastest spreadsheet component you'll find out there, and with a small bundle size. By the way, support is awesome."

Lucas Segers,

"We vetted 10 JavaScript components and we must say that Jspreadsheet comes out as the best."

Lode Cools,

"The latest version of Jspreadsheet is a powerful data grid tool, providing an excellent front end for our spreadsheet interface. The Jspreadsheet team is helpful and quick to respond."

Dana Stoesz,

What Developers Build with This JavaScript Spreadsheet

Spreadsheets with Excel-compatible formulas

Formulas work out of the box: type them in cells or ship them with your data, as in the quickstart above. Calculations run on the client with the same syntax users know from Excel, including cross-worksheet references. The formulas documentation covers custom functions, and Formula Pro adds the complete 500+ function set.

Excel file import and export

Let users drop an XLSX file into your application, edit it, and download the result. Formulas, formatting, merged cells, and multiple worksheets survive the round trip. See import from XLSX and export to XLSX.

Data entry with typed columns

Each column can enforce a type with its own editor: dropdowns, calendars, checkboxes, images, colors, and more.

columns: [
    { title: 'Product', type: 'text', width: '200px' },
    { title: 'Category', type: 'dropdown', source: ['Hardware', 'Software'], width: '160px' },
    { title: 'Launch date', type: 'calendar', width: '140px' },
]

The full list of editors is in the columns documentation.

Reacting to user changes

Every edit fires an event, which makes it straightforward to sync spreadsheet data with your backend, local storage, or a chart library:

jspreadsheet(document.getElementById('spreadsheet'), {
    worksheets: [{ minDimensions: [10, 10] }],
    onchange: (worksheet, cell, x, y, value) => {
        console.log(`Cell (${x}, ${y}) changed to ${value}`);
    },
});

All events are listed in the events documentation.

How Jspreadsheet Compares to Other JavaScript Spreadsheet Libraries

SpreadJS is feature-rich but heavy, with pricing to match. Handsontable is capable but leaves XLSX handling to third-party libraries. Choose Jspreadsheet for a lightweight core with full Excel compatibility at a lower total cost of ownership. See the detailed Handsontable comparison, SpreadJS comparison, and pricing.

Frequently Asked Questions

Is there a free JavaScript spreadsheet library?

Yes. Jspreadsheet CE is MIT-licensed and free, including for commercial use. The Pro edition on this page adds XLSX import and export, the 500+ function formula engine, real-time collaboration, and more, with a 30-day free trial and no credit card required.

Does Jspreadsheet require a framework?

No. Jspreadsheet is written in vanilla JavaScript and works with a plain script tag or any bundler. Official wrappers exist for React, Vue, and Angular when you need them.

Can users open and save Excel files?

Yes. XLSX, XLS, and CSV import and export are built in. Formulas, cell formatting, merged cells, and multiple worksheets are preserved in both directions.

How many rows can a JavaScript spreadsheet handle?

Hundreds of thousands of rows. Virtual rendering only draws visible cells, so scrolling and editing stay smooth as data grows.

What is the difference between a JavaScript spreadsheet and a data grid?

A spreadsheet gives users free-form editing with formulas and Excel behavior. A data grid presents structured records with typed columns and validation. Jspreadsheet does both: see the JavaScript data grid page for the data-centric view, or the JavaScript table page for lightweight editable tables.

More resources

Getting started · Documentation · Examples · JavaScript data grid · JavaScript table · React spreadsheet · Vue spreadsheet · Angular spreadsheet