I have a problem with a Wordpress-run website: http://www.igorlipinski.com - Safari freezes and eventually crashes on iOS devices while using the zoom option, either double tap or pinch to zoom option. It looks and works very well on desktop browsers. I can't quite locate the problem... any thoughts? Thanks in advance!
UPDATE: I disabled javascript on my iPhone and the site worked beautifully, so at least I know where to look now! I would appreciate if anyone had a direct solution for this particular site, but I will work on it in the meantime.
I have faced similar kind of issue. Found issue with canvas drawing.
Basically there is one issue with canvas drawing. when we draw or erase something using canvas's methods like drawRect(), lineTo(), moveTo(), etc... it will create extra layer (like pixels on canvas) which causes memory leakage issue in safari browser for ipads/mobiles.
I am still looking for solution/alternative for memory leakage while using canvas.
Hope this will help you find any clue related to your project.
Related
I researched a lot about this problem and I'm going crazy trying to understand why my example is causing a crash on Firefox, and runs VERY SLOWLY con Internet Explorer and mobile devices.
I'm rendering a big (4K) image on a sphere geometry, trying to create a kind of a pano viewer. In the real application, we can go from one place to the next one, clicking on the invisible shapes that are created inside the sphere.
In the real app, we have a big (4K) video rendering so we have some stuff in a certain area that moves in a loop. However, for this demo I commented those lines (addVideoTexture and renderVideo), so I understand this is not the issue here.
Pay attention to our raycaster, I suspect it is causing big performance problems, but I don't know any other way of detecting when our mouse is going over an "action hotspot" (look above) or a "indicator hotspot" (invisible areas that would allow to go to other places when clicking).
raycaster.setFromCamera(mouse, camera);
hits = raycaster.intersectObjects(indicatorHotspotPlane, false);
The problem is that this demo is causing a crash on Firefox, and going very very slow on plenty of devices and Internet Explorer.
Thanks a lot...
Ricardo
Here is an example where you can test it:
https://jsfiddle.net/ggL3uemh/13/
The ThreeJS version is r89
The browsers where it causes problems are Firefox and Internet Explorer, and I see some iOS devices going slow too.
So I made a project using Three.js and everything works how I want it to on desktop browsers, tested using chrome, and firefox. When I try to open the project on any mobile browser, safari, chrome, or IE, some objects are not rendered these objects have normal maps and textures which appear fine on desktop but are not rendered at all on mobile. In addition objects appear to be overly bright on mobile and sometimes flicker going from behind one another to in front of one another.
One user suggested adding this.image = image; to the three.js file at line 18420 but this did not solve the issue. Here is a link to the project here http://pixelpusher.ninja/Ocean%20World/OceanWorld.html. You can inspect the page to view the source code. Has anyone ran into problems like this on mobile before? Any help is appreciated. Thanks!
I need to display a huge image (at least 2000x2000) on Android with Titanium and let the user scroll around, just like they were using a scroll view on iOS. However, I know Android doesn't support the same kind of scroll view, so I opted to use an ImageView.
I'm unable to display this image properly or at least the way I'd like (without it being blurry when you zoom in) because of memory issues. Has anyone found a way to make large scrollable images work in Titanium on Android without potential memory crashes?
I tried WebView also, but it seemed to resize my image and when you zoomed it was blurry as well. I was hoping Android webview supported SVG, but it looks like they don't on a majority of devices.
This is by far the best answer I've found:
http://www.tenxperts.com/2011/07/13/working-with-large-images-in-android/
I tried it and it works well with Titanium web views.
I was working on an image gallery and it involved some heavy image moving\resizing using javascript. Everything worked like a charm on all the broswers except for IE6\7 (no wonder) and ... Google Chrome.
Basically under certain zooming each movement made Chrome redraw the background, making it jitter, change its position and then move back. I can't post link to the actual script at the moment, but I used a jquery plugin to immitate the problem:
http://danilsk.narod.ru/wtf.html (try zooming in and out and clicking images)
Does anyone know how to fight this?
I am using google chrome and I see no issue here.
Everything is running very smoothly. Try updating your browser.
FYI:
Ubuntu 10.04 LTS - the Lucid Lynx
Google Chrome 8.0.552.215
It does show text, but in the completely wrong place (not even on the Canvas element itself!), and in the wrong color (always black). Has anyone had experience with this or gotten it working?
Yes, this was broken in iOS before 4.0.
It seems to work fine in iOS 4.0 and later.