My website http://remotejobs.io crashes Safari consistently. I first noticed the crash last night when I was at a Verizon store and I tried browser testing the site on an iPad. So I tried 2 more iPads at the same store, and the site crashed iOS Safari on all 3 devies, every single time I tried to hit the domain.
The exact workflow is:
- Open Safari
- Enter http://remotejobs.io
That's it. As soon as you hit go the site crashes.
This also happens on desktop Safari (tested in 6.0.3 on OSX 10.8.3 only), and produces an error report every time. Here's a copy of one of the error reports generated: http://go.jag.is/OGcS
The site is not throwing any JS errors, and works fine on other modern browsers that I have tested, including Chrome, Firefox, and even IE9 (shockingly enough).
One strange thing though, is that it only seems to crash iOS Safari on iPads, not iPhones, as I can successfully load the site on my iPhone every time.
What on earth could be causing this, and how do I debug it?
UPDATE: I tried commenting out the main stylesheet, and the site no longer crashes Safari without that stylesheet. I tried both a regular stylesheet, and a minified stylesheet, and both crash the browser.
UPDATE 2: I narrowed it down to the CSS by commenting out JS and leaving CSS in, and still it crashed. Then I tried removing all the transition properties, and it no longer crashes. So apparently the transition properties were causing the crash.
So I was able to narrow the problem down to the CSS with Adam Moore's suggestion, and then to the
transition
property declarations with Jonathan Sampson's comment.I removed all the lines with
transition
and the site no longer crashed.So then I looked at the values, and tried unifying the duration values, to see if that would help, since I was setting several different duration values across the different properties, including
.5s
on one,.3s
on another, and.25s
on yet a couple more. But unifying them didn't affect anything - still crashed.Finally, I tried changing the
transition-property
fromall
tocolor
, sincecolor
was the only thing I was really changing, and no more crashes! So apparently that was the solution. Seems Safari was choking on trying to transition all the properties.I stumbled across the same issue in Safari and tried everything mentioned here. I also checked the css in the CSS validator and fixed some issues.
But my trigger for the crash were padding with percentage values. I converted the %-Values from the paddings and all the things were fine.
Your website does not seem to crash Safari 5.1 on Windows 7. To go about debugging what's causing the issue, start by turning off the CSS, then one by one disable JS files until the website stops crashing. Once you've figured out which CSS file or JS file it is, then post a link to the file and I'll see if I can help!
-webkit-transform-style: preserve-3d !important;
Caused Safari to continuously reload because of error. Removed that and it worked. :).
Safari - Version 8.0.8 (10600.8.9) OSX EL Captain