I have a react.js app that runs fine on Chrome, Firefox, and Safari.
However it lags heavily and sometimes freezes on any version of Internet Explorer. Is there away to speed it up on IE? This seems like more than an optimization issue and the difference between Chrome and IE is drastic.
Extra Info:
I have tested on IE 9-11 as well as Edge, and all seem to have this issue. It is slow and laggy in general but freezes or lags incredibly on a hover event.
Related
Here's a basic example to illustrate the problem, https://codesandbox.io/s/4rz9zmvj79. This doesn't work on Chrome 68/69, but it works fine on Firefox 62. It seems like Chrome doesn't support updating clipPath transform, but I'm not sure if this is a browser bug.
I have a problem with my wordpress website. All the Images are choppy when i scroll down the page on Chrome and Safari, but the result it is very good and smooth on Firefox.
Here is my website : http://matieresetcouleurs.ch/
For you to compare, here is the kind of website i want, and the images are not choppy on this one : http://www.dcube.swiss/
Do you have any clues of what the problem can be ?
Thanks for your help.
Jules
I am not having any scroll issues...either your computer memory is not enough or internet problems. Perhaps empty your browser cache for chrome and internet explorer.
Also optimise your images to make sure they are not big filesize.
I am using javascript fullscreen API. Everything works fine and in all browsers as well except for IE < 11 which is OK. The transition to fullscreen is very smooth in Windows Safari, seems to be fine in FF and but in chrome, opera and chromium, the transition is very absurd.Most of the times, the screen just below the browser seems to appear for a moment and then transition to the fullscreen happens. It flickers too much which is very distracting and not a good UI experience. I noticed something similar in youtube as well that too only in the above mentioned browsers. Is there a way the transition can be handled or at least the flicker can be controlled?
Thanks in advance
I’m having a problem with the use of sprite sheets in mobile browsers (ipad/android), a strange behavior occurs, the stage is multiplied and scaled down multiple times when i click on a sprite animation, everything works fine until the click occurs.
Any hint?
The only browser that it doesn’t occurs is the safari from the ios 6 beta in ipad 2. In the native android browser the error happens but in android chrome everything works fine.
In desktop browsers everything works fine.
UPDATE: the problem is the afterFrame, the error is that the index is not valid. I don't understand... what does the afterFrame? i have 7 frames and it gives error if the after frame is superior to 2...
What version are you using? This sounds like a bug that has been fixed in v4.0.1.
https://github.com/ericdrowell/KineticJS/wiki/Change-Log
The javascript library I have created just translates a single picture and zooms it. Touch events and mouse events are used depending on what device.
I ran this javascript code on Firefox (7.0.1), iPhone 3GS (iOS 5.0) and iPhone 4 (iOS 5.0) all with smooth performance, no problem at all.
Then I ran it on iPad 1 (iOS 5.0) with slow performance though zooming and translating the picture works.
Last test was on iPad 2 (iOS 4.3.3) and here I experienced the same slow performance while zooming as iPad 1 but the translating didnt work at all.
I have no clue what this is about, since iPhone is supposed to be alot weaker than an iPad. I would appreciate any help or comments to get me on the right track.
http://pastebin.com/wZ7e77yq
UPDATE
I just ran it on an iPad 2 (iOS 5.0) and it works flawlessly. I also tried iPhone 3GS (iOS 4.2.1) and it didnt work, same as iOS 4.3.3. This means that my application needs iOS 5.0 to run... is it really true you couldnt translate objects before iOS 5.0?
UPDATE2
I just ran it on three different iPad 1s (iOS 5.0) and it doesnt work very good. What is the big difference in between an iPhone 4 and an iPad 1? Specs are almost identical. Also the translate didnt work because the function event.pageY/X doesnt work prior to iOS 5. This was fixed by using event.touches.pageX/Y instead.
Well I was developing a small game for testing canvas performance without any special game framework so I kept it simple because I was writing it by myself. The program did nothing special, just moving a sprite around the screen with different joystick types, such as keyboard and mouse for desktop click, and touch events for iOS. I discovered the following:
Using taps direct on the canvas results in poor performance compared to touch events.
Touch events worked well with different canvas sizes up to 1024x768.
I didn't try picture zooming, but that should have be fine as well.
event.pageX, event.pageY worked without problems on iPad (iOS5).
I hope that helps.
Seems like perhaps iOS CANVAS support was the issue. iOS5 has full GPU hardware-accelerated CANVAS support, while previous versions supported CANVAS albeit very poorly.
Surprised that it does not work well on iPad 1 even with iOS 5, though. Can you try closing all currently-running apps, close all other browser tabs, and run the test again?