JavaScript Data Grid with Advanced Spreadsheet Controls

With the best front-end data grid component, developers can integrate professional spreadsheet controls into their applications faster and more flexibly than ever.






JavaScript Vanilla React data grid VueJS data grid Angular data grid typescript LemonadeJS data grid


Used by the world’s leading companies
Virgin Media Samsung Elemental Delloite Nissan Johnson & Johnson General Electrics McKinsey Kawasaki BP Comcast Asahikasei Lockheed Denso Wave Moody's Verizon BCG Honeywell Kyocera Mizuho Noritz Lexisnexis
The One Billion Cells JavaScript Data Grid (10.000 x 100.000)

Manipulate large amounts of data in a tabular format

Work with literally millions of records in milliseconds. The new data grid version includes a navigation system that leverages the viewport to load only the data visible to the user. This feature enhances the user experience by creating a seamless and speedy performance while minimizing the application's resource utilization.

Deliver Spreadsheet Experiences to your Applications

Over 400 implemented excel-like formulas. A feature-rich data grid component that includes functions like cross worksheets, filtering, export to xlsx, import from xlsx, data binding, and more.

<html>
<script src="https://jspreadsheet.com/v10/jspreadsheet.js"></script>
<link rel="stylesheet" href="https://jspreadsheet.com/v10/jspreadsheet.css" />
<script src="https://jsuites.net/v5/jsuites.js"></script>
<link rel="stylesheet" href="https://jsuites.net/v5/jsuites.css" type="text/css" />
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Material+Icons" />
<div id="spreadsheet"></div>
<script>
// Set your license here
jspreadsheet.setLicense('your-license');
// Create the data grid component
let worksheets = jspreadsheet(document.getElementById('spreadsheet'), {
    worksheets: [
        {
            minDimensions: [6,6]
        }
    ]
});
</script>
</html>

import React, { useRef, useState } from "react";
import { Spreadsheet, Worksheet, jspreadsheet } from "@jspreadsheet/react";
// Set your license here
jspreadsheet.setLicense('your-license');
// Create Data Grid Component
export default function App() {
    // Spreadsheet array of worksheets
    const spreadsheet = useRef();

    // Render component
    return (
        <Spreadsheet ref={spreadsheet}>
            <Worksheet />
        </Spreadsheet>
    );
}

<template>
    <Spreadsheet ref="spreadsheet" :license="license">
        <Worksheet />
    </Spreadsheet>
</template>
<script>
import { Spreadsheet, Worksheet } from "@jspreadsheet/vue";
// Set your license here
const license = 'your-license';
// Create component
export default {
    components: { Spreadsheet, Worksheet },
    data() {
        return {
            license: license,
        }
    }
}
</script>

import { Component, ViewChild, ElementRef } from "@angular/core";
import jspreadsheet from "jspreadsheet";

import "jspreadsheet/dist/jspreadsheet.css"
import "jsuites/dist/jsuites.css"
// Set your license
jspreadsheet.setLicense('your license');
// Create Data Grid Component
@Component({
    selector: "app-root",
    template: `<div #spreadsheet></div>`
})
export class AppComponent {
    @ViewChild("spreadsheet") spreadsheet: ElementRef;
    // Worksheets
    worksheets: jspreadsheet.worksheetInstance[];
    // Create a new data grid
    ngAfterViewInit() {
        // Create spreadsheet
        this.worksheets = jspreadsheet(this.spreadsheet.nativeElement, {
            worksheets: [{ minDimensions: [10,10] }]
        });
    }
}

Choose how you want to work

In an agnostic platform, you’ve got all the flexibility to work with JavaScript, React, Angular, Vue, and Typescript. Our JavaScript Data Grid component gives you extensive documentation, excellent technical support, and the freedom to create custom plugins.


Keep control of your data

Jspreadsheet is a frontend data grid tool; for this reason, we don’t have access to, process or store your data. All data is managed offline on the client side.

Enhance Your JavaScript Data Grid with AI

Incorporate ChatGPT API or Llama into your web-based data grids to enable automated content generation and advanced data analysis. When paired with Jspreadsheet Server, this powerful integration empowers real-time data queries directly from the front end, connecting to your back-end API to deliver instant insights and responses to users.

JavaScript Data Grid with Full-Stack Capabilities

Unlock real-time collaboration, new ways to implement persistence, automation, non-consecutive selections, advanced multi-copy handling, optimized array operations, and robust privacy controls.
Integrations

Integrations

Jspreadsheet allows you to integrate your spreadsheet with other plugins to create rich applications.
Lightweight Tool

Lightweight

Just 0.3 Mb. Jspreadsheet is designed to be lean and efficient, making it a breeze to integrate into your application.
Persistence

Persistence

Different methods, events, and features to help with the backend data persistence.

What Our Customers Are Saying

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

“Jspreadsheet is the fastest spreadsheet component you’ll find. By the way, support is fantastic”.
Lucas Segers
Software Engineer
“We vetted 10 JavaScript components and we must say that Jspreadsheet comes out as the best”.
Lode Cools
CTO & Co-founder
“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
Developer

Try it for free

The free trial certificate is valid for 30 days. If you need additional time for testing, kindly inform us, and we will extend the period for you.


What is Jspreadsheet?

Jspreadsheet is a robust full-stack JavaScript Data Grid solution that directly integrates the functionality and user-friendly experience of spreadsheet applications like Excel and Google Sheets into your web applications. It offers a smooth, efficient user interface, enabling batch actions, table manipulation, and a host of other features that ensure flawless compatibility between your web application and Excel/Sheets. This familiar environment enhances productivity, simplifies user adoption, and minimizes the need for extensive training.

More than just a JS data grid component, Jspreadsheet is a comprehensive solution designed to meet a variety of application requirements in spreadsheet and data management for web platforms. It optimizes workflow development, streamlines process automation, and facilitates the smooth transition of tasks from Excel to the web. Additionally, Jspreadsheet provides a wide range of extensions to address diverse needs within the data grid and spreadsheet ecosystem, making it a versatile choice for various business applications.