---
# System prepended metadata

title: now the facts.

---

### the branch: pefrormance-analysis

but we have a short summary, with open conclusion, basically the ground to discussion

the main suspect is `elementFromHtml` module.
we assumed that the main user of these module is `particleContent`, coz this guy calls other transformations.

so we decided to wrap every call of `particleContent` by improvised `measurer` function:
```
const measurer = (fn, name) => (...args) => {
  if (__BROWSER__) {
    performance.mark(`${name}-a`)
    const result = fn(...args)
    performance.mark(`${name}-b`)

    performance.measure(`${name}`, `${name}-a`, `${name}-b`)
    return result
  } else return fn(...args)
}
```

these measurer provide us some information, which can be extracted by `performance.getEntriesByType('measure')`

# now the facts.

#### in the diabetes article we mostly parse spans
```
res = {}
performance.getEntriesByType(`measure`).forEach(({name}) =>{
	res[name] = (res[name]||0) + 1
})
console.log(res)
```
![](https://i.imgur.com/mCUzsIj.png)

#### if we sort it by duration we can see that span`s are in the top
```
performance.getEntriesByType(`measure`).sort((a,b) => b.duration-a.duration)
```
![](https://i.imgur.com/2vuIFih.jpg)

#### let's calculate how much time tool all transformations 
```
performance.getEntriesByType(`measure`).reduce((acc, item) => {return acc += item.duration}, 0)
```
![](https://i.imgur.com/Yk7RMAM.png)

#### if we remove all transformation logic from `span` we have drastically smaller number
![](https://i.imgur.com/6jKQAmV.png)

# but

#### if we get the time of the whole process (roughly) of parcing the article, and see how long it takes *with* `span`
```
var a = performance.getEntriesByType(`measure`).sort((a,b) => a.startTime-b.startTime)

console.log(a[a.length-1].startTime - a[0].startTime)

```
![](https://i.imgur.com/fdwv2W3.png)

#### compare with same process but w/o `span`
![](https://i.imgur.com/T43uYwe.png)

as you can see it's only twice faster. so the dependency is not linear

## lets compare amount of calls to our main suspect - `elementFromHtml` and the time of whole process
```
a - is the summ amount of calls
lol - object with all the callers (the first function in the call stack)
```

#### this is  with the `span` 
![](https://i.imgur.com/nnoHGom.png)

#### this is without
![](https://i.imgur.com/zkt5Nfe.png)

as you can see we drastically reduced a load from the `elementFromHtml` but time wasn't reduced accordingly. 
```
288/36 = 8
4756/2266 = 2
```

## those were the facts, we'd like to discuss the conclusion together or spend more time on it

