Webpage crashing android browsers

Question

Can someone help me understand why this page causes Android browsers to crash?

http://thewellcommunity.org

All subpages work very well, but when I load the main page on Android, the browser application simply closes without any warnings or error messages. I tried this on 3 Android phones and on the Kindle Fire.

When I completely disable JavaScript in the browser on the phone, the page loads successfully. Unfortunately this is a live website, so I would rather keep the disabled pieces of JavaScript on the server side as a last resort.

On the one hand, Opera Mini, Opera Mobile and Firefox on an Android phone are not a failure, but Dolphin, Miren and a browser for the browser.

UPDATE: Looks like I spoke too early when I said that this was fixed. I was able to reduce the frequency of the browser crash, but when the page loads, it still sometimes crashes. :(

UPDATE # 2: now it seems that the crash may be related to CSS. After spending weeks enabling and disabling various pieces of JavaScript, I tried to disable the stylesheet, and now I can not make it crash.

Does anyone know an Android CSS error that could be causing this? I guess this is due to some CSS that only gets access after JavaScript works.

Answer 1

I found the culprit ... It seems that the css font family rule is to blame. Although, I'm not sure why, since the same font stack uses several other places on the site.: \

Here is the line that caused the problem ...

.Site-Search .Buttons input { ... font-family: TeXGyreHerosRegular, Arial, "Helvetica Neue", Helvetica, sans-serif; ... } 

For some reason, this line caused the crash of all Android browsers. Weird

Answer 2

Check out Weinre . An explanation can be seen in this youtube movie. This way you can debug your Android web browser browser just like the well-known Firebug.

In the Eclipse emulator (2.3), it loads fine, but has some layout flaws.

Answer 3

If someone came here looking for a possible reason that all of their mobile browsers might suffer after a few seconds when loading a certain site, this may be due to the version of jQuery used.

For example, the LG-p690f and HTC Incredible S are some of the few Android 2.3.x phones that are known to encounter changes in jQuery 1.8.1 and 1.8.2 due to a javascript JavaScript error that will cause jQuery Animation to fail in this line:

 percent = 1 - ( remaining / animation.duration || 0 ) 

If you own a website, you can try switching to 1.8.3 (or downgrade to 1.7.x if allowed). Otherwise, you can send an email to the website.

Sources:

http://bugs.jquery.com/ticket/12497

https://github.com/jquery/jquery/pull/1019