Articles
Building Excel-like spreadsheets in React and Vue — performance, formulas, xlsx round-tripping, and ReoGrid Web release notes.
-
· unvell teamReoGrid Web v1.3 — multi-sheet workbooks and cross-sheet formulas
ReoGrid Web v1.3 turns the grid into a workbook of N worksheets — a core-provided sheet tab bar, per-sheet undo, whole-workbook xlsx/JSON I/O, and cross-sheet formula references like =Sheet1!A1. No breaking API changes.
#release #v1.3 #multi-sheet #workbook #spreadsheet -
· unvell teamCheckboxes, Dropdowns, and Progress Bars in Cells — Building a Live Attendance Sheet with Cell Types
Bring the interactive parts of an Excel business sheet — checkboxes, pick lists, progress bars — to the web without rebuilding them as HTML forms. A full worked example: a weekly attendance sheet using ReoGrid Web's 8 built-in cell types.
#cell-types #checkbox #dropdown #spreadsheet #attendance #ui -
· unvell teamOne million rows in a browser spreadsheet — without loading one million rows
Three weeks ago we wrote that a million rows was out of scope for ReoGrid Web. We changed our mind. Here's the delay-load data source: a scrollbar that represents 1,000,000 rows while the grid holds only the few hundred you can actually see.
#performance #big-data #lazy-loading #spreadsheet #javascript -
· unvell teamWhen Excel is your layout tool: move merged-cell forms to the web without rebuilding them
A lot of business 'spreadsheets' are really forms — merged cells, borders, fixed column widths, embedded formulas. Two practical ways to bring them to the web with ReoGrid Web: load the existing .xlsx as-is, or rebuild it in code. With working examples.
#excel #xlsx #forms #invoice #spreadsheet #merged-cells -
· unvell teamUsing ReoGrid in Angular — an Excel-like spreadsheet, no wrapper needed
ReoGrid Web ships React and Vue wrappers, but the core is framework-agnostic. Here's how to drop a canvas-based, Excel-like spreadsheet into an Angular app in about 30 lines — with editing, formulas, and xlsx import.
#angular #spreadsheet #data-grid #excel #typescript -
· unvell teamReading and writing Excel files in JavaScript — import, export, and JSON
How to load .xlsx files into the browser, export a grid back to Excel, and convert between xlsx and JSON — all client-side, with styles and formats preserved. Practical code with ReoGrid Web.
#excel #xlsx #import #export #json #javascript -
· unvell teamFrom ReoGrid .NET to ReoGrid Web — bringing your spreadsheet to the browser
If you've used ReoGrid in WinForms or WPF, the Web edition will feel familiar: same Excel-like model, same xlsx fidelity, now in React, Vue, and vanilla JS. Here's what carries over, what changes, and how to bridge the two.
#dotnet #winforms #wpf #migration #spreadsheet #web - · unvell team
ReoGrid Web vs Luckysheet vs x-spreadsheet — choosing a JavaScript spreadsheet
A practical comparison of three canvas/spreadsheet-style JS libraries — Luckysheet, x-spreadsheet, and ReoGrid Web — covering rendering, xlsx fidelity, maintenance, licensing, and which one fits your project.
#comparison #luckysheet #x-spreadsheet #spreadsheet #open-source #canvas -
· unvell teamBuild an online XLSX viewer in React — files never leave the browser
Most 'XLSX viewer online' tools upload your spreadsheet to a server you don't control. Here is a complete React component that opens .xlsx files entirely in the browser — read-only, with styles, merges, and formulas preserved. No upload, no backend, no account.
#xlsx #excel #react #viewer #file-api -
· unvell teamBuilding a Vue invoice with editable formulas in ~60 lines
A real Vue 3 invoice component: editable quantities and unit prices, automatic line subtotals via formulas, SUM, tax, total — all in a single canvas-backed spreadsheet. The math updates live, and a computed ref mirrors the grand total into your Vue UI. Export to xlsx in one call (Pro).
#vue #tutorial #formula #invoice #spreadsheet -
· unvell teamExcel-like business forms on the web — you don't need Excel to build them
Most developers don't realise the browser can load, display, and edit real Excel files without a server — and that the same spreadsheet component can build invoice-quality forms from scratch, or blend both. Here's how ReoGrid Web makes it possible.
#tutorial #invoice #spreadsheet #excel -
· unvell teamReoGrid Web vs AG Grid vs Handsontable — picking the right grid
An honest comparison of the three main JavaScript grid libraries from the ReoGrid team's perspective: where each one fits, what their tradeoffs are, and how to decide which one your project actually needs.
#comparison #ag-grid #handsontable #spreadsheet #data-grid #react #vue -
· unvell teamBuilding a React invoice with editable formulas in ~60 lines
A real React invoice component: editable quantities and unit prices, automatic line subtotals via formulas, SUM, tax, total — all in a single canvas-backed spreadsheet. The math updates in real time. Users can export to xlsx (Pro).
#react #tutorial #formula #invoice #spreadsheet - · unvell team
Importing real Excel files in the browser — no upload, no server
Drag an .xlsx file onto a web page, render it in a spreadsheet UI with cell styles, merges, borders, freeze panes, and formulas preserved. No backend, no SheetJS, no progress modals — and it loads a 440k-cell file in 3.7 seconds.
#xlsx #excel #react #vue #file-api #performance - · unvell team
Rendering 10,000 rows in the browser — how ReoGrid Web stays at 60fps
A canvas-based spreadsheet doesn't have a DOM bottleneck, but it can still die a thousand cuts in the 2D context. Here's how ReoGrid Web renders a dense 10,000-row sheet without per-row React reconciliation, virtualization gymnastics, or jank.
#performance #canvas #react #vue #spreadsheet -
· unvell teamIntroducing ReoGrid Web v1.2 — an Excel-grade spreadsheet for React and Vue
ReoGrid Web v1.2 ships 109 built-in formulas, Excel-style color-coded reference editing, an auto-fill handle, and ~70% fewer canvas calls per scroll frame — in a single ~100 KB (min+gzip) package with first-class React and Vue wrappers.
#release #v1.2 #react #vue #spreadsheet