[Bug] Initializing GeoJSONLayer with one LineString feature takes ~500ms
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 14.6k
- Forks
- 2.3k
- Avg merge
- 2d 9h
- Merged PRs (30d)
- 42
Description
Description
Adding a GeoJSON layer with one LineString feature (two vertexes) takes about 500ms. I was only able to reproduce this in Chrome and Firefox on Windows and MacOS.
I don't see this behavior when using Safari on iOS or MacOS.
Flavors
- React
- Python/Jupyter notebook
- MapboxLayer
- GoogleMapsOverlay
- CartoLayer
- DeckLayer/DeckRenderer for ArcGIS
Expected Behavior
My expectation was creating a layer in its simplest form should almost be instantaneous.
Steps to Reproduce
To reproduce the issue, please run the following CodePen:
https://codepen.io/urdeveloper-the-flexboxer/pen/dyKzgeB
Click on Draw Path, then Draw Point then Draw Path.
The delay to draw a red line is very noticeable.
Drawing the red point is roughly three times faster but still slow in my opinion.
Environment
- Framework version:
- Browser: Chrome, Firefox
- OS: Windows, MacOS
Logs
The warnings from Chrome:
(After clicking on Draw Path)
[Violation] 'requestAnimationFrame' handler took 593ms
(After clicking on Draw Point)
[Violation] 'requestAnimationFrame' handler took 164ms
(After clicking on Draw Point again)
[Violation] 'requestAnimationFrame' handler took 560ms
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the linked CodePen reproduction and the GeoJSONLayer initialization path, then profile the requestAnimationFrame handler in Chrome and Firefox. Compare the Draw Path and Draw Point timings and identify where the delay occurs; done means the reported initialization slowdown is reduced and covered by an appropriate regression check.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- frontend, performance, web-dev
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 38/100