Permalink
Browse files

⚡ Reduce memory usage, improve performance

Object.freeze() does magic, why to observe arrays of thousands values,
when you'll never changes any of them? When you just replace whole
parent.
Plus reducing number of point in array helps too.
  • Loading branch information...
ra100 committed Oct 7, 2017
1 parent 18b9433 commit 983ada8ddf75c16043da0378844b34ef67c7b077
Showing with 37 additions and 28 deletions.
  1. +3 −12 src/store/DataLoader.js
  2. +34 −16 src/store/{workers/carsWorker.js → helper/cars.js}
@@ -1,11 +1,10 @@
import axios from 'axios'
import CarsWorker from './workers/carsWorker.js'
import cars from './helper/cars.js'
import local from '../../config/local'
const timeframe = (30 * 24 * 60 * 60) // 30 days
const step = 300

const client = axios.create(local.axiosConfig)
const worker = new CarsWorker()

const {metricsKeys, filter} = local

@@ -33,16 +32,8 @@ export const getData = async ({from, to} = {}) => {
callApi({query: metricsKeys.lng, start, end}),
callApi({query: metricsKeys.available, start, end})
])
return new Promise((resolve, reject) => {
worker.onmessage = ({data}) => {
return resolve(data)
}
worker.onerror = (error) => {
reject(new Error(error))
}
// https://stackoverflow.com/questions/42376464/uncaught-domexception-failed-to-execute-postmessage-on-window-an-object-co
worker.postMessage({action: 'processCars', results: JSON.parse(JSON.stringify(results))})
})
const data = cars.processCars({results})
return Promise.resolve(data)
} catch (error) {
console.error(error)
}
@@ -13,7 +13,7 @@ const getTrail = (values) =>
return acc
}, [])

const processCars = ({results}) => {
export const processCars = ({results}) => {
const cars = {}
const locations = {}
const [latResult, lngResult, availableResult] = results
@@ -38,27 +38,45 @@ const processCars = ({results}) => {
const lngValues = car.lng
const availableValues = car.available
const newCar = {metric: car.metric, values: [], trail: [], visible: true}
newCar.values = latValues.map((oneLat, index) => {
const key = `${oneLat[1]},${lngValues[index][1]}`
;(locations[key] = (!!locations[key] && locations[key]) || 0)
;locations[key] += Number(availableValues[index][1])
return {
newCar.values = latValues.reduce((acc, oneLat, index) => {
const curr = {
lat: oneLat[1],
lng: lngValues[index][1],
available: availableValues[index][1]
}
})
if (index === 0) {
return [curr]
}
const prev = acc[acc.length - 1]
if (prev.lat === curr.lat && prev.lng === curr.lng && prev.available === curr.available) {
return acc
}
const key = `${oneLat[1]},${lngValues[index][1]}`
;(locations[key] = (!!locations[key] && locations[key]) || 0)
;locations[key] += Number(availableValues[index][1])
acc.push(curr)
return acc
}, [])
newCar.trail = getTrail(newCar.values)
cars[car.metric.name] = newCar
cars[car.metric.name] = {
trail: Object.freeze(newCar.trail),
visible: newCar.visible,
metric: Object.freeze(newCar.metric),
values: Object.freeze(newCar.values)
}
})
return {cars, locations}
}

self.addEventListener('message', (event) => {
const {data: {action}} = event
if (!action || action !== 'processCars') {
return
}
const result = processCars(event.data)
self.postMessage(result)
})
export default {
processCars
}

// self.addEventListener('message', (event) => {
// const {data: {action}} = event
// if (!action || action !== 'processCars') {
// return
// }
// const result = processCars(event.data)
// self.postMessage(result)
// })

0 comments on commit 983ada8

Please sign in to comment.