perf: use while instead of for of

src/Chart.ts

@@ -396,7 +396,8 @@ export default class ChartImp implements Chart {
   private _setPaneOptions (options: PaneOptions, forceShouldAdjust: boolean): void {
     let shouldMeasureHeight = false
     let shouldAdjust = forceShouldAdjust
-    for (const pane of this._drawPanes) {
+    for (let i = 0; i < this._drawPanes.length; i++) {
+      const pane = this._drawPanes[i]
       const paneIdValid = isValid(options.id)
       const isSpecify = paneIdValid && pane.getId() === options.id
       if (isSpecify || !paneIdValid) {
@@ -438,9 +439,9 @@ export default class ChartImp implements Chart {
 
   getXAxisPane (): XAxisPane { return this._xAxisPane }
 
-  getAllDrawPanes (): DrawPane[] { return this._drawPanes }
+  getDrawPanes (): DrawPane[] { return this._drawPanes }
 
-  getAllSeparatorPanes (): Map<DrawPane, SeparatorPane> { return this._separatorPanes }
+  getSeparatorPanes (): Map<DrawPane, SeparatorPane> { return this._separatorPanes }
 
   adjustPaneViewport (
     shouldMeasureHeight: boolean,
@@ -477,11 +478,9 @@ export default class ChartImp implements Chart {
       const pane = this.getDrawPaneById(paneId)
       pane?.update(level)
     } else {
-      this._separatorPanes.forEach(pane => {
-        pane.update(level)
-      })
       this._drawPanes.forEach(pane => {
         pane.update(level)
+        this._separatorPanes.get(pane)?.update(level)
       })
     }
   }
@@ -1022,11 +1021,9 @@ export default class ChartImp implements Chart {
     this._chartEvent.destroy()
     this._drawPanes.forEach(pane => {
       pane.destroy()
+      this._separatorPanes.get(pane)?.destroy()
     })
     this._drawPanes = []
-    this._separatorPanes.forEach(pane => {
-      pane.destroy()
-    })
     this._separatorPanes.clear()
     this._container.removeChild(this._chartContainer)
   }

src/Event.ts

@@ -606,7 +606,7 @@ export default class Event implements EventHandler {
 
   private _findWidgetByEvent (event: MouseTouchEvent): EventTriggerWidgetInfo {
     const { x, y } = event
-    const separatorPanes = this._chart.getAllSeparatorPanes()
+    const separatorPanes = this._chart.getSeparatorPanes()
     const separatorSize = this._chart.getChartStore().getStyles().separator.size
     for (const [, pane] of separatorPanes) {
       const bounding = pane.getBounding()
@@ -619,10 +619,11 @@ export default class Event implements EventHandler {
       }
     }
 
-    const drawPanes = this._chart.getAllDrawPanes()
+    const drawPanes = this._chart.getDrawPanes()
 
     let pane: Nullable<DrawPane> = null
-    for (const p of drawPanes) {
+    for (let i = 0; i < drawPanes.length; i++) {
+      const p = drawPanes[i]
       const bounding = p.getBounding()
       if (
         x >= bounding.left && x <= bounding.left + bounding.width &&

src/common/Eventful.ts

@@ -39,7 +39,8 @@ export default abstract class Eventful implements EventDispatcher {
   }
 
   checkEventOn (event: MouseTouchEvent): boolean {
-    for (const eventful of this._children) {
+    for (let i = 0; i < this._children.length; i++) {
+      const eventful = this._children[i]
       if (eventful.checkEventOn(event)) {
         return true
       }

src/common/utils/number.ts

@@ -112,10 +112,14 @@ export function getPrecision (value: number): number {
 
 export function getMaxMin<D> (dataList: D[], maxKey: keyof D, minKey: keyof D): number[] {
   const maxMin = [Number.MIN_SAFE_INTEGER, Number.MAX_SAFE_INTEGER]
-  dataList.forEach(data => {
+  const dataLength = dataList.length
+  let index = 0
+  while (index < dataLength) {
+    const data = dataList[index]
     maxMin[0] = Math.max((data[maxKey] ?? data) as number, maxMin[0])
     maxMin[1] = Math.min((data[minKey] ?? data) as number, maxMin[1])
-  })
+    ++index
+  }
   return maxMin
 }
 

src/common/utils/typeChecks.ts

@@ -71,7 +71,7 @@ export function isObject (value: any): value is object {
 }
 
 export function isNumber (value: any): value is number {
-  return typeof value === 'number' && !isNaN(value)
+  return typeof value === 'number' && !Number.isNaN(value)
 }
 
 export function isValid<T> (value: T | null | undefined): value is T {

src/store/TimeScaleStore.ts

@@ -246,7 +246,8 @@ export default class TimeScaleStore {
       }
     })
     this._visibleTimeTickList = []
-    for (const tick of tickList) {
+    for (let i = 0; i < tickList.length; i++) {
+      const tick = tickList[i]
       if (tick.dataIndex >= this._visibleRange.from && tick.dataIndex <= this._visibleRange.to) {
         this._visibleTimeTickList.push(tick)
       }

src/view/ChildrenView.ts

@@ -29,8 +29,11 @@ export default abstract class ChildrenView extends View<YAxis> {
     const chartStore = pane.getChart().getChartStore()
     const visibleDataList = chartStore.getVisibleDataList()
     const barSpace = chartStore.getTimeScaleStore().getBarSpace()
-    visibleDataList.forEach((data: VisibleData, index: number) => {
-      childCallback(data, barSpace, index)
-    })
+    const dataLength = visibleDataList.length
+    let index = 0
+    while (index < dataLength) {
+      childCallback(visibleDataList[index], barSpace, index)
+      ++index
+    }
   }
 }

src/view/IndicatorView.ts

@@ -32,7 +32,8 @@ export default class IndicatorView extends CandleBarView {
     const yAxis = pane.getAxisComponent()
     if (!yAxis.isInCandle()) {
       const indicators = chartStore.getIndicatorStore().getInstanceByPaneId(pane.getId())
-      for (const indicator of indicators) {
+      for (let i = 0; i < indicators.length; i++) {
+        const indicator = indicators[i]
         if (indicator.shouldOhlc && indicator.visible) {
           const indicatorStyles = indicator.styles
           const defaultStyles = chartStore.getStyles().indicator