i am developing a feature with React.js "Which is like a car 360 walkaround" but i’m getting a lot of troubles with latency and assets requests.
These problems will be explained later
You can see the example, demo or reference that i’m trying to accomplish (Only the drag feature):
And right now this is all i have done "My page"
This is the link of the source code of my page (Github)
- Extra notes: I’m only focused on the drag feature
Now i’ll try to explain the first problem:
- Repetitive image request:
What i mean with this error of repetitive request is that, everytime that i start dragging on the canvas, A new request of the image is made. for example:
Click this link in order to see the image which shows these repeated request
Currently if you open the devtools of you preferred navigator, Example: Chrome-devtools.
You could see perfectly that My page and the demo page currently pre-load these images
before the user can use the drag feature
But the main difference is:
1- In my page, every time that i start dragging on the canvas, a new request of the image is made, which is not an optimal solution for "costs and perfomance"
2- But in the Demo page, a new request does not happen, it just pre-load the images like i explained before.
Now, this is the help that i am asking:
So guys, i would love if there is a way or advice for not making these repetitive request,
that’s why i also uploaded my source code, so you could download it and make these changes, so you could show me a work-around, i already got 2 days exploding my head looking for that solution, i’m open to big changes, it does not matter.
Now i’ll try to explain the second problem
- Latency of the drag feature
What i mean with this bug of the latency is that:
The dragging feature of the demo page is faster than the dragging feature of my website
i would love if there is a way or advice for making my website dragging, faster just like the demo example.
In case you did not understand, the second problem, what i mean is:
I would love to find a way for making my canvas render just responsive and fast like the demo page
Thanks for your patience of reading!
The source code of my page