Image for post
Image for post

ag-Grid can process over 150,000 updates per second. Together with the latest browsers and ag-Grid’s cutting-edge algorithms, let me introduce you to the fastest JavaScript datagrid in the world.

The Test

Before going into all the detail, here is the test running in all it’s glory. You are invited to open the test in a new tab an play around with it. The test starts up with a load test for processing 1,000 updates every second.

Test Results

These test were done with the following hardware / software:

  • Dell XPS 15" 9550
  • Intel Core i7–6700HQ with 32GB Memory
  • Windows 10 Pro 64-bit
  • Chrome Browser full screen on 1920 x 1080…


Image for post
Image for post

There are two ways to absolute position DOM elements on the screen:

  1. Using CSS position: absoluteand style.top/style.left attributes;
  2. Using CSS position: absolute and style.transform(translateX, translateY) attributes.

This article explains what both are and demonstrates how using transform animations perform better by utilizing the GPU.

Using Top / Left Attribute

Using position: absolute and style.top/style.left is the traditional way of positioning and was designed with web page layout in mind. If you animate transitions using this mechanism they do NOT use the GPU if available.

The following code snippet shows what setting this up looks like for animating the vertical position of a DOM element using style.top. …


Image for post
Image for post

Although ag-Grid is the best JavaScript data grid in the world, it doesn’t mean the development team at ag-Grid are finished. We will not be found asleep at the wheel!!! Over the month of October the core team has been busy with v14 of ag-Grid codenamed “Halloween”. We are excited with this release as it is packed full of new features, enhancements and bug releases. Let me take you through some of the highlights…

Revamped Feature: Tree Data


This article was posted on www.ag-grid.com to explain to users what performance hacks are used inside ag-Grid.

Make It Faster

ag-Grid is a JavaScript data grid for displaying large amounts of data in the browser in a style similar to Excel spreadsheets. ag-Grid is fast, even in Internet Explorer with large volumes of data. This blog presents performance patterns, or performance ‘hacks’, that we used to put our grid on steroids.

We describe how to squeeze performance out of the browser which can be applied to anyone wanting to tune their own applications. It will be of particular interest to users of ag-Grid to improve understanding of how to work with the grid. We also think that it will be of interest to anyone creating a grid. …


While creating ag-Grid, the best grid in the world, I desired a JavaScript datagrid that could navigate and manage big data in a way that had never been done before. Before tackling the big data problem, I solved the small data problem, by making ag-Grid better than all the other grids when all the data could fit in browser memory. That was a good start! …


Image for post
Image for post

While creating ag-Grid, the best grid in the world, I desired a JavaScript data grid that could navigate and manage big data in a way that had never been done before. Before tackling the big data problem, I solved the small data problem, by making ag-Grid better than all the other grids when all the data could fit in browser memory. That was a good start! …


Image for post
Image for post

ag-Grid started life as an open source project and true to these roots, it now comes in two versions; ag-Grid Free and ag-Grid Enterprise. ag-Grid Free is a feature rich datagrid that is and will always remain free to use.

ag-Grid Enterprise funds the company as it continues it’s work creating the best JavaScript datagrid in the world. Since launching a year ago, it has attracted over 500 customers including 10% of the Fortune 500.

Living The Coder’s Dream

We have somehow managed to live the coder’s dream — transitioning an open-source project into a successful commercial offering.

We found ourselves in a unique position with a strong revenue stream and the ability to contribute to the community we started in. …


Now that we have done many conferences, we clearly understand why our users choose ag-Grid over the competition. This article explains the main reasons why ag-Grid is becoming the leading JavaScript datagrid.

1. The ‘ag’ in ag-Grid stands for AGnostic

ag-Grid has zero dependencies such as Angular or React, we don’t even use JQuery, Underscore or LoDash. The foundations of ag-Grid is a custom made framework designed specifically for ag-Grid. Having no dependency means ag-Grid will work with any framework — we call this framework agnostic.

Being framework agnostic allows you to choose your framework and datagrid separately. It also reduces the work required when you move frameworks (e.g. …


At the start of 2015 I was in a day job with a problem: I couldn’t find a decent JavaScript datagrid for our enterprise applications.

So I decided to write my own. I called it ag-Grid.

After presenting it at Angular Connect 2015, I quit my job to work on the project full time. A year on and things have changed beyond all expectations.

Here’s the story how, in under a year, my side project grew into a company that was a major sponsor at Angular Connect 2016 — one of Europe’s largest Angular conferences.

Public speaking is exhausting

Image for post
Image for post
Niall speaking at Angular Connect 2015. If my eyes look tired, it’s because I was.

Speaking at Angular Connect 2015 scared me. I’d not spoken in public before, never mind to 1,000 people while simultaneously being streamed live on YouTube. …


Last week saw the release of version 6.x of ag-Grid. This release signifies a large step forward for ag-Grid, offering full support for Angular 2 Components within the grid itself.

Benefits of Angular 2 Components

As a Angular 2 developer, you’re probably already aware of the power of the Angular 2 framework — you can now apply this to components within ag-Grid. You’ll get all the flexibility that the Angular 2 frameworks offers from within the grid.

Ok, I’m ready for the complicated configuration — bring it on!

To have ag-Grid available to your Angular 2 application, you need to import the AgGridModule. All you need to do is:

@NgModule({
imports: [
BrowserModule,
AgGridModule.forRoot(),
...
})

The forRoot part is to ensure our providers are injected at the root level (or rather, are singletons). …

About

Niall Crosby

I am the CEO of ag-Grid. I have 15 years of experience building Enterprise applications before launching my own product ag-Grid Enterprise.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store