JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.highcharts.com/highcharts.js"></script>
<div id="container" style="height: 1000px; width: 600px"></div>

JavaScript

_defaultHCRowOptions = {
    exporting: {
        enabled: true,
    },
    credits: { enabled: true},
    xAxis: { title: '', },
    yAxis: { title: '', },
    title: {
        text: '',
        style: {  display: 'none'  }
    },
    subtitle: {
        text: '',
        style: { display: 'none' }
    },
    tooltip: {
        enabled: true,
        followPointer: true,
    },
};

$(function () {
    var HCOptions = _defaultHCRowOptions;
    var customized = {
        chart: { renderTo: 'container', },	
    }; 
    $.extend(HCOptions, customized);
    var chart = new Highcharts.Chart(HCOptions, function(chart) {
        var startTime = $.now();        
        var ren = chart.renderer;
        
        for (var i = 0; i < 20000; i++) {
            ren.rect(i, i, 100, 100, 0).attr({ fill: '#FF0000' }).add();
        }
        
        var endTime = $.now();
		console.log('Time: ' + (endTime - startTime));
    });
});