Highcharts drops adapters

Posted on December 16, 2015 by Torstein Hønsi. Last modified on April 04, 2016.

We’re proud to introduce Highcharts 4.2, an update mainly dedicated to restructuring Highcharts. Highstock and Highmaps are also released in version 4.2, thereby aligning the versioning to Highcharts. This simplifies maintenance and streamlines the use of our popular highcharts npm package. The new features are:

 

No framework needed

Ever since Highcharts’ initial release, it has relied on frameworks, primarily jQuery, for common tasks like animation and event handling. However, in trying to build the best JavaScript charting library possible, we faced many the same frustrations as our users: Different frameworks and framework versions called for unique workarounds, adding undesirable overhead, complexity, and maintenance challenges. We found that we could remove the framework adapters and include our own framework at only 600 bytes filesize overhead! Getting rid of the framework adapters has a number of advantages:

  • Simplified installation in non-jQuery environments, notably Browserify and Webpack.
  • Reduced network latency because only one file is loaded.
  • It still works exactly like it did in pages where jQuery is present.
  • Simplifies testing and maintenance leading to a more stable product.
  • 5% faster than running through jQuery.

 

Simplified constructors

All constructors in the Highcharts suite, Highcharts.Chart, Highcharts.StockChart and Highcharts.Map, now have a lowercase counterpart that allows instantiating without the new keyword, to stop complaints from linters when the chart is not assigned to a variable. The new constructors are Highcharts.chart, Highcharts.stockChart and Highcharts.mapChart respectively. Furthermore, instead of defining the renderTo div deep inside the configuration structure, you can now pass it as the first argument. This makes the configuration simpler, and provides a logic separation of options defining the chart itself, and where to add it.

Highcharts.chart(‘container’, { 
    series: [{
        data: [1, 3, 2, 4]
    }]
});

All without breaking backwards compatibility, of course.

 

No globals

Highcharts is now able to run without any reference to a global window object or other globals. This makes it possible to require Highcharts and all its modules on a node.js server, or in an isomorphic React application, without a DOM. You may even instantiate charts without complaints if you pass in a window shim, for example from jsdom. Or take it even further, and generate charts completely without a browser, even PhantomJS! Server side generation of charts is a common use case for generating reports or emails.