[{"data":1,"prerenderedAt":764},["ShallowReactive",2],{"blog-en-reogrid-web-release":3},{"id":4,"title":5,"author":6,"body":7,"date":748,"description":749,"extension":750,"meta":751,"navigation":206,"path":752,"seo":753,"stem":755,"tags":756,"thumbnail":762,"__hash__":763},"blog_en/blog/en/reogrid-web-release.md","ReoGrid Web — Now Officially Released. A Powerful Excel-Like Web Spreadsheet Library",null,{"type":8,"value":9,"toc":729},"minimark",[10,19,24,27,30,33,37,44,47,49,53,58,61,68,72,79,114,118,124,138,142,149,155,159,162,240,330,334,337,339,343,350,444,450,454,457,461,464,466,470,595,602,607,609,613,616,669,671,675,693,725],[11,12,13,14,18],"p",{},"UNVELL Inc. is pleased to announce the official release of ",[15,16,17],"strong",{},"ReoGrid Web"," today, March 24, 2026 — a JavaScript/TypeScript library for embedding Excel-like spreadsheet functionality into web applications.",[20,21,23],"h2",{"id":22},"what-is-reogrid-web","What Is ReoGrid Web?",[11,25,26],{},"ReoGrid Web is an Excel-like spreadsheet library that runs in the browser. It bundles the formula engine, Excel I/O, and Canvas rendering engine all into a single package, with full support for both React and Vue.",[11,28,29],{},"A single library is all you need to add to your project to deliver Excel-equivalent spreadsheet functionality in a web app.",[31,32],"hr",{},[20,34,36],{"id":35},"background-bringing-10-years-of-net-know-how-to-the-web","Background — Bringing 10+ Years of .NET Know-How to the Web",[11,38,39,40,43],{},"We've been developing and shipping ",[15,41,42],{},"ReoGrid for .NET"," (WinForms / WPF) since 2014. Cumulative NuGet downloads now exceed 180,000.",[11,45,46],{},"Building on a decade of work on cell modeling, formula engines, and Excel compatibility, we built ReoGrid Web as a new product for web developers.",[31,48],{},[20,50,52],{"id":51},"highlight-features","Highlight Features",[54,55,57],"h3",{"id":56},"invoice-demo-the-power-of-the-formula-engine","Invoice Demo — The Power of the Formula Engine",[11,59,60],{},"We've prepared an invoice demo as a practical showcase of the formula engine. Enter quantities and unit prices, and totals are calculated automatically. You can build formulas just like in Excel.",[11,62,63],{},[64,65],"img",{"alt":66,"src":67},"Invoice demo — automatic calculation via the formula engine","/images/articles/reogrid-web-invoice.png",[54,69,71],{"id":70},"high-excel-compatibility","High Excel Compatibility",[11,73,74,75,78],{},"A central design priority for ReoGrid Web was ",[15,76,77],{},"strong Excel compatibility",".",[80,81,82,89,95],"ul",{},[83,84,85,88],"li",{},[15,86,87],{},"Formula compatibility",": SUM, AVERAGE, IF, VLOOKUP and other key functions are implemented; cell references are Excel-compatible",[83,90,91,94],{},[15,92,93],{},"xlsx import / export",": Cell values, formulas, styles, borders, and merged cells are preserved on read and write",[83,96,97,100,101,105,106,109,110,113],{},[15,98,99],{},"Excel number formats",": Excel format strings such as ",[102,103,104],"code",{},"#,##0.00",", ",[102,107,108],{},"¥#,##0",", and ",[102,111,112],{},"yyyy/mm/dd"," work as-is",[54,115,117],{"id":116},"cell-styles-and-excel-compatible-layout","Cell Styles and Excel-Compatible Layout",[11,119,120],{},[64,121],{"alt":122,"src":123},"Cell style sample","/images/articles/reogrid-web-cell-styles.png",[80,125,126,132],{},[83,127,128,131],{},[15,129,130],{},"Faithful cell-style reproduction",": Fonts, text colors, background colors, alignment, and indentation match Excel's precision",[83,133,134,137],{},[15,135,136],{},"Borders and merged cells",": Border style, weight, and color can be set per edge; merged cells behave the same as in Excel",[54,139,141],{"id":140},"optimized-high-performance-rendering","Optimized High-Performance Rendering",[11,143,144,145,148],{},"A virtual scrolling approach renders only the cells in the visible area, keeping rendering smooth even past 10,000 rows. In our measurements, ",[15,146,147],{},"100,000 cells (10,000 rows × 10 columns) initialize in around 200ms — about 2μs per cell"," — roughly 95× faster than competing products (per our internal benchmarks).",[11,150,151],{},[64,152],{"alt":153,"src":154},"Demo of data filtering, sorting, and large-dataset rendering","/images/articles/reogrid-web-data-table.png",[54,156,158],{"id":157},"react-and-vue-support","React and Vue Support",[11,160,161],{},"Both frameworks have built-in wrappers, with TypeScript type definitions so autocomplete works out of the box.",[163,164,169],"pre",{"className":165,"code":166,"language":167,"meta":168,"style":168},"language-tsx shiki shiki-themes github-light github-dark","// React\nimport { Reogrid } from '@reogrid/lite/react';\n\n\u003CReogrid style={{ width: '100%', height: '400px' }} />\n","tsx","",[102,170,171,180,201,208],{"__ignoreMap":168},[172,173,176],"span",{"class":174,"line":175},"line",1,[172,177,179],{"class":178},"sJ8bj","// React\n",[172,181,183,187,191,194,198],{"class":174,"line":182},2,[172,184,186],{"class":185},"szBVR","import",[172,188,190],{"class":189},"sVt8B"," { Reogrid } ",[172,192,193],{"class":185},"from",[172,195,197],{"class":196},"sZZnC"," '@reogrid/lite/react'",[172,199,200],{"class":189},";\n",[172,202,204],{"class":174,"line":203},3,[172,205,207],{"emptyLinePlaceholder":206},true,"\n",[172,209,211,214,218,222,225,228,231,234,237],{"class":174,"line":210},4,[172,212,213],{"class":189},"\u003C",[172,215,217],{"class":216},"sj4cs","Reogrid",[172,219,221],{"class":220},"sScJk"," style",[172,223,224],{"class":185},"=",[172,226,227],{"class":189},"{{ width: ",[172,229,230],{"class":196},"'100%'",[172,232,233],{"class":189},", height: ",[172,235,236],{"class":196},"'400px'",[172,238,239],{"class":189}," }} />\n",[163,241,245],{"className":242,"code":243,"language":244,"meta":168,"style":168},"language-vue shiki shiki-themes github-light github-dark","\u003C!-- Vue -->\n\u003Cscript setup>\nimport { Reogrid } from '@reogrid/lite/vue';\n\u003C/script>\n\n\u003Ctemplate>\n  \u003CReogrid style=\"width: 100%; height: 400px\" />\n\u003C/template>\n","vue",[102,246,247,252,266,279,288,293,303,321],{"__ignoreMap":168},[172,248,249],{"class":174,"line":175},[172,250,251],{"class":178},"\u003C!-- Vue -->\n",[172,253,254,256,260,263],{"class":174,"line":182},[172,255,213],{"class":189},[172,257,259],{"class":258},"s9eBZ","script",[172,261,262],{"class":220}," setup",[172,264,265],{"class":189},">\n",[172,267,268,270,272,274,277],{"class":174,"line":203},[172,269,186],{"class":185},[172,271,190],{"class":189},[172,273,193],{"class":185},[172,275,276],{"class":196}," '@reogrid/lite/vue'",[172,278,200],{"class":189},[172,280,281,284,286],{"class":174,"line":210},[172,282,283],{"class":189},"\u003C/",[172,285,259],{"class":258},[172,287,265],{"class":189},[172,289,291],{"class":174,"line":290},5,[172,292,207],{"emptyLinePlaceholder":206},[172,294,296,298,301],{"class":174,"line":295},6,[172,297,213],{"class":189},[172,299,300],{"class":258},"template",[172,302,265],{"class":189},[172,304,306,309,311,313,315,318],{"class":174,"line":305},7,[172,307,308],{"class":189},"  \u003C",[172,310,217],{"class":258},[172,312,221],{"class":220},[172,314,224],{"class":189},[172,316,317],{"class":196},"\"width: 100%; height: 400px\"",[172,319,320],{"class":189}," />\n",[172,322,324,326,328],{"class":174,"line":323},8,[172,325,283],{"class":189},[172,327,300],{"class":258},[172,329,265],{"class":189},[54,331,333],{"id":332},"native-support-for-japanese-and-japanese-formats","Native Support for Japanese and Japanese Formats",[11,335,336],{},"Japanese number formats (¥1,234), date formats (yyyy年M月d日), and Japanese era support are implemented natively — not bolted on as a localization layer.",[31,338],{},[20,340,342],{"id":341},"world-class-bundle-efficiency","World-Class Bundle Efficiency",[11,344,345,346,349],{},"Despite shipping a full feature set, ReoGrid Web ships at ",[15,347,348],{},"68 KB gzip (248 KB minified)"," — among the smallest in the world for this class of library.",[351,352,353,372],"table",{},[354,355,356],"thead",{},[357,358,359,363,366,369],"tr",{},[360,361,362],"th",{},"Library",[360,364,365],{},"gzip",[360,367,368],{},"Built-in Formulas",[360,370,371],{},"Built-in Excel I/O",[373,374,375,393,406,419,432],"tbody",{},[357,376,377,383,388,391],{},[378,379,380,382],"td",{},[15,381,17],{}," (Japan)",[378,384,385],{},[15,386,387],{},"68 KB",[378,389,390],{},"✅",[378,392,390],{},[357,394,395,398,401,403],{},[378,396,397],{},"Comparable A (overseas)",[378,399,400],{},"122 KB",[378,402,390],{},[378,404,405],{},"❌",[357,407,408,411,414,416],{},[378,409,410],{},"Comparable B (overseas)",[378,412,413],{},"621 KB",[378,415,390],{},[378,417,418],{},"△",[357,420,421,424,427,430],{},[378,422,423],{},"Comparable C (Japan)",[378,425,426],{},"1,700+ KB",[378,428,429],{},"✅ (separate pkg)",[378,431,429],{},[357,433,434,437,440,442],{},[378,435,436],{},"Comparable D (overseas)",[378,438,439],{},"830+ KB",[378,441,390],{},[378,443,429],{},[11,445,446],{},[447,448,449],"em",{},"Per our internal review (March 2026)",[54,451,453],{"id":452},"the-only-five-conditions-one-package-library-in-the-world","The Only \"Five Conditions, One Package\" Library in the World",[11,455,456],{},"Canvas rendering, zero dependencies, formula engine, Excel I/O, and React/Vue wrappers — ReoGrid Web is the only library that delivers all five from a single package, with no add-ons (per our review of five major products, March 2026).",[54,458,460],{"id":459},"a-fully-japan-made-canvas-web-spreadsheet","A Fully Japan-Made Canvas Web Spreadsheet",[11,462,463],{},"Built in Japan, ReoGrid Web supports the Japan-specific formatting and business-form layouts that overseas products have struggled to handle, making adoption smooth for systems operated in Japan.",[31,465],{},[20,467,469],{"id":468},"editions","Editions",[351,471,472,487],{},[354,473,474],{},[357,475,476,478,481,484],{},[360,477],{},[360,479,480],{},"Lite",[360,482,483],{},"Pro",[360,485,486],{},"Enterprise",[373,488,489,505,519,533,546,558,570,582],{},[357,490,491,494,499,502],{},[378,492,493],{},"Price",[378,495,496],{},[15,497,498],{},"Free",[378,500,501],{},"From ¥88,000",[378,503,504],{},"From ¥165,000",[357,506,507,510,513,516],{},[378,508,509],{},"For",[378,511,512],{},"Individuals / general apps",[378,514,515],{},"Business / commercial apps",[378,517,518],{},"Business / large-scale commercial deployment",[357,520,521,524,527,530],{},[378,522,523],{},"Domains",[378,525,526],{},"Unlimited",[378,528,529],{},"3 domains",[378,531,532],{},"30 domains (unlimited option available)",[357,534,535,538,541,544],{},[378,536,537],{},"Spreadsheet features",[378,539,540],{},"Basic",[378,542,543],{},"Full",[378,545,543],{},[357,547,548,551,554,556],{},[378,549,550],{},"Formula engine",[378,552,553],{},"Basic operations",[378,555,543],{},[378,557,543],{},[357,559,560,563,566,568],{},[378,561,562],{},"Excel I/O",[378,564,565],{},"Excel import only",[378,567,543],{},[378,569,543],{},[357,571,572,575,578,580],{},[378,573,574],{},"Cell types",[378,576,577],{},"Partial",[378,579,543],{},[378,581,543],{},[357,583,584,587,590,593],{},[378,585,586],{},"Technical support",[378,588,589],{},"None",[378,591,592],{},"3 months from purchase",[378,594,592],{},[11,596,597,598,601],{},"ReoGrid Web uses a perpetual-license (one-time purchase) model. Compared with subscription-based products commonly priced at around ¥150,000 per developer per year, the ",[15,599,600],{},"total cost for 3 developers, 1 domain, and 3 years can be up to roughly 1/78"," of subscription pricing (per our internal review).",[11,603,604],{},[447,605,606],{},"Pricing as of March 2026. All amounts include tax. See the official site for the latest pricing.",[31,608],{},[20,610,612],{"id":611},"roadmap","Roadmap",[11,614,615],{},"Planned feature additions:",[351,617,618,628],{},[354,619,620],{},[357,621,622,625],{},[360,623,624],{},"Timeline",[360,626,627],{},"What's Coming",[373,629,630,638,646,654,662],{},[357,631,632,635],{},[378,633,634],{},"Soon",[378,636,637],{},"Conditional formatting",[357,639,640,643],{},[378,641,642],{},"Summer 2026",[378,644,645],{},"Online PDF generation",[357,647,648,651],{},[378,649,650],{},"Fall 2026",[378,652,653],{},"100+ Excel functions",[357,655,656,659],{},[378,657,658],{},"In development",[378,660,661],{},"AI features (natural-language operations, formula authoring assistance)",[357,663,664,666],{},[378,665,658],{},[378,667,668],{},"Auto-completion for data and formulas",[31,670],{},[20,672,674],{"id":673},"try-the-lite-edition","Try the Lite Edition",[163,676,680],{"className":677,"code":678,"language":679,"meta":168,"style":168},"language-bash shiki shiki-themes github-light github-dark","npm install @reogrid/lite\n","bash",[102,681,682],{"__ignoreMap":168},[172,683,684,687,690],{"class":174,"line":175},[172,685,686],{"class":220},"npm",[172,688,689],{"class":196}," install",[172,691,692],{"class":196}," @reogrid/lite\n",[80,694,695,704,711,718],{},[83,696,697],{},[698,699,703],"a",{"href":700,"rel":701},"https://web.reogrid.net/",[702],"nofollow","Product site",[83,705,706],{},[698,707,710],{"href":708,"rel":709},"https://reogrid.net/info-require",[702],"Inquiry / request for materials",[83,712,713],{},[698,714,717],{"href":715,"rel":716},"https://web.reogrid.net/demos",[702],"Live demo gallery",[83,719,720],{},[698,721,724],{"href":722,"rel":723},"https://www.npmjs.com/package/@reogrid/lite",[702],"npm package (@reogrid/lite)",[726,727,728],"style",{},"html pre.shiki code .sJ8bj, html code.shiki .sJ8bj{--shiki-default:#6A737D;--shiki-dark:#6A737D}html pre.shiki code .szBVR, html code.shiki .szBVR{--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}html pre.shiki code .sj4cs, html code.shiki .sj4cs{--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .s9eBZ, html code.shiki .s9eBZ{--shiki-default:#22863A;--shiki-dark:#85E89D}",{"title":168,"searchDepth":182,"depth":182,"links":730},[731,732,733,741,745,746,747],{"id":22,"depth":182,"text":23},{"id":35,"depth":182,"text":36},{"id":51,"depth":182,"text":52,"children":734},[735,736,737,738,739,740],{"id":56,"depth":203,"text":57},{"id":70,"depth":203,"text":71},{"id":116,"depth":203,"text":117},{"id":140,"depth":203,"text":141},{"id":157,"depth":203,"text":158},{"id":332,"depth":203,"text":333},{"id":341,"depth":182,"text":342,"children":742},[743,744],{"id":452,"depth":203,"text":453},{"id":459,"depth":203,"text":460},{"id":468,"depth":182,"text":469},{"id":611,"depth":182,"text":612},{"id":673,"depth":182,"text":674},"2026-03-24","ReoGrid Web — our new product that lets you embed an Excel-like spreadsheet into web applications — is now officially released. Built-in formula engine and Excel I/O, with React and Vue support. The Lite edition is free to try.","md",{},"/blog/en/reogrid-web-release",{"title":5,"description":754},"ReoGrid Web — a high-performance JavaScript library for embedding Excel-like spreadsheets in web applications, with a built-in formula engine, Excel I/O, and React/Vue support — is now officially released. Available in Lite (free), Pro, and Enterprise editions.","blog/en/reogrid-web-release",[757,758,759,760,761],"reogrid","reogrid-web","spreadsheet","release","javascript","/images/articles/reogrid-web-release.png","9AfyKaYmuWphi0PxZ93MhxKJfiyOv7xC6lhTqda3iMM",1777394490705]