Javascript - Optimal Way for Data Binning

Question

I have a problem to find the most performant way to bin some OHLCV data into different periods.

Assume that I have several ten-thousands of OHLCV data with a simple structure like:

{
   "timestamp":1472688000000,
   "open":77.644997,
   "high":78.320331,
   "close":78.320331,
   "low":77.638,
   "volume":300
}

Now, this data is per minute or per second. For obvious reasons, I should be able to bin this data into 1m - 15m - 1hr - 4hr - 1d - 1M - 3M - 6M - 1Y periods. All examples I found were about zooming in and out the data, a.k.a just showing a part of the data but what I require is to aggregate it.

OHLCV data simply does not sum up, I mean you cannot simply sum up 15 x 1m data and create a 15m data point but there are rules for different attributes like;

• Take 15 x 1m data points
• Take the open value of the first data point
• Take the close value of the last data point
• Take the highest high and lowest low among all points
• Sum up all volumes into volume
• The the timestamp value of the first data point

For other periods, we can reuse the same logic with different calculated periods like 4 x 15m to 1hr or 4 x 1hr to 4hr and etc.

This is of course doable by basic JavaScript but it is not performant enough when switching between periods.

To sum up, my questions are;

• Is there a performant way to achieve such data binning or are there any such libraries I can use?
• Is there a known charting library usable by ReactJs and React Native providing such functionality out of the box?

Thank you.