SC not loading on iPhone

Dear SuttaCentral geeks,
For the past few days I’ve been unable to load the site on my iPhone 5s in Safari. It reloads the page several times and then displays

'A problem repeatedly occurred on “https://suttacentral.net/”.

I have also tried in Chrome for iPhone and it crashes Chrome.
I’ve cleared my cache on my phone and tried both on wifi and mobile data. I’ve tried debugging it with my phone plugged into safari desktop but it’s not able to capture the issue. To me it seems like an issues with the SSL, but I could be mistaken.

Tech specs:
iPhone 5s running IOS 9.2.1

I’m reasonably technically minded so I’m happy to help diagnose issues if needed.

Thanks for an amazing resource!

With Metta
Michelle

2 Likes

Okay, thanks for the heads up, it is probably due to our new font loader. None of us have an iPhone, unfortunately! Can I ask you to check our staging site and let us know if the same problem happens there? I just confirmed it with another iPhone, and it happens on staging as well. So it’s not the SSL, as staging uses http.

@blake, can you look into this?

1 Like

Hi Bhante,
Thanks for looking into this.
Please let me know if I can help test things somehow.

Best wishes
Michelle

Hi Michelle,

Anyway, if this has prompted you to join our Discourse community, then it’s not all bad!

It’s possible to plug an iPhone into a computer and check the “developer” settings on the browser. As it happens, a friend who’s staying here has an iPhone of the same model, and he showed me this. But having no experience with iPhones I’m not sure how useful I’d be. Would you like to have a go at this?

Hi Bhante,
I’ve tried working through the debugger in Safari’s Developer mode with my iPhone plugged in, but I can’t see anything too useful. When I reload the page, the debugger crashes and loses the network recording I try and make. I’ve made a video capture of the process and very quickly grabbed a still screenshot or the timeline and a shot of the end result which is just what is rendered by my browser.

Here’s a link to my video capture


I work in web design but my knowledge is somewhat lacking in terms of this sort of debugging. Hopefully this is of some use to @blake

1 Like

I’m not sure if it’s related, but I have had Skolar font crash browsers in Ubuntu when using particular custom font rendering settings (to be specific, installing Infinality), so for an inexplicable problem that would be my first suspect - actually it didn’t just crash browsers, it crashed anything which I tried to use Skolar in, meaning it wasn’t a problem with the browser but the operating system the font rendering was being delegated to.

One thing to try, probably easiest in Chrome, would be repurposing an ad-block type plugin and making a rule that blocks any skolar font from loading, a pattern like *skolar* should probably do the trick. If the site then loads successfully we have our culprit.

This site (Discourse) is using the same fonts, and there is no problem. I still think we should be looking at the font loader.

After weeks of having my phone suggest I upgrade to iOS 9.3.2 I finally bothered to do it.

Lo and behold, SC now loads in both Chrome and Safari.

I wasn’t sure if it was coincidence due to this thread or whether it was a quirk in my previous iOS and safari. However, it sounds like the former.

Apologies for being ‘that’ user. I have an older phone and am reticent to keep upgrading operating systems because we know how Apple’s business model works! Hopefully, not too many SC users are in the same boat as me.

I did make a backup before upgrading. So I can go back and help you guys figure out what’s going on if you’re worried about covering that particular issue.

Interesting, thanks. I’ll suggest that to my friend here.

Earlier in the week I spent three days with an unusable computer. It would just keep freezing all the time, windows become unresponsive, and so on. I tried everything, hassling forums and making bug reports, fixing, updating, uninstalling and reinstalling software.

Ultimately I wiped my hard drive and installed a fresh OS. I still remember the moment, about 5 minutes after starting my brand new OS, and it started to freeze again. I literally felt a chill down my spine. I was being stalked by this thing. It was like a horror movie. It just would not die.

Then I noticed a clump of dust in my mouse. I pulled it out and everything was fine.

We’ve all been “that” user!

2 Likes

I had to laugh. I did that once but it turned out the way I was sitting I had my knee resting on the space bar which was why my computer was unresponsive. :smiley:

1 Like

You’d think they’d fix these obvious bugs before shipping a broken piece of hardware …

1 Like

We aren’t using a font loader, the font used on Discourse is an older subset, so it’s not the same file, and it’s woff instead of woff2.

Anyway another debugging idea, it’d be helpful to see if there are any errors in the Chrome inspector log panel. Might be hard to catch them. There’s an option to “preserve log” which may help.

Also from poking around the web, apparently -webkit-transition can cause crashes, that’s one we definitely use in places.

In Firefox debugging I get this:

GET 
https://suttacentral.net/ [HTTP/2.0 200 OK 444ms]
Strict-Transport-Security: The site specified a header that could not be parsed successfully.[Learn More] /
GET 
https://suttacentral.net/css/compiled/core-2f13aee2.css [HTTP/2.0 304 Not Modified 19ms]
GET 
https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.1/jquery.min.js [HTTP/2.0 304 Not Modified 21ms]
GET 
https://suttacentral.net/js/compiled/core-13fc51d6.js [HTTP/2.0 304 Not Modified 22ms]
Unknown pseudo-class or pseudo-element '-webkit-search-cancel-button'.  Ruleset ignored due to bad selector. core-2f13aee2.css:1:1619
Error in parsing value for 'font-weight'.  Skipped to next declaration. core-2f13aee2.css:1:4559
Error in parsing value for 'font-weight'.  Skipped to next declaration. core-2f13aee2.css:1:5728
Error in parsing value for 'font-weight'.  Skipped to next declaration. core-2f13aee2.css:1:6439
Error in parsing value for 'font-weight'.  Skipped to next declaration. core-2f13aee2.css:1:8533
Expected end of value but found 'serif'.  Error in parsing value for 'font-family'.  Declaration dropped. core-2f13aee2.css:1:11078
Expected end of value but found 'serif'.  Error in parsing value for 'font-family'.  Declaration dropped. core-2f13aee2.css:1:11353
Unknown pseudo-class or pseudo-element 'selection'.  Ruleset ignored due to bad selector. core-2f13aee2.css:1:12262
Unknown pseudo-class or pseudo-element '-webkit-selection'.  Ruleset ignored due to bad selector. core-2f13aee2.css:1:12307
Error in parsing value for 'background-image'.  Declaration dropped. core-2f13aee2.css:1:35244
Error in parsing value for 'background-image'.  Declaration dropped. core-2f13aee2.css:1:35298
Error in parsing value for 'background-image'.  Declaration dropped. core-2f13aee2.css:1:35351
Error in parsing value for 'background-image'.  Declaration dropped. core-2f13aee2.css:1:35579
Error in parsing value for 'background-image'.  Declaration dropped. core-2f13aee2.css:1:35633
Error in parsing value for 'background-image'.  Declaration dropped. core-2f13aee2.css:1:35686
Unknown pseudo-class or pseudo-element 'inline'.  Ruleset ignored due to bad selector. core-2f13aee2.css:1:40341
Expected end of value but found 'serif'.  Error in parsing value for 'font-family'.  Declaration dropped. core-2f13aee2.css:1:43683
Unknown property '-moz-border-radius'.  Declaration dropped. core-2f13aee2.css:1:49654
Unknown property 'zoom'.  Declaration dropped. core-2f13aee2.css:1:60555
Unknown property 'orphans'.  Declaration dropped. core-2f13aee2.css:1:69431
Unknown property 'widows'.  Declaration dropped. core-2f13aee2.css:1:69440
unreachable code after return statement core-13fc51d6.js:149:0
unreachable code after return statement core-13fc51d6.js:283:0
unreachable code after return statement core-13fc51d6.js:456:166
unreachable code after return statement core-13fc51d6.js:492:0
unreachable code after return statement core-13fc51d6.js:149:0
unreachable code after return statement core-13fc51d6.js:456:166
unreachable code after return statement core-13fc51d6.js:492:0
mutating the [[Prototype]] of an object will cause your code to run very slowly; instead create the object with the correct initial [[Prototype]] value using Object.create core-13fc51d6.js:79:377
GET 
XHR 
https://suttacentral.net/data [HTTP/2.0 200 OK 791ms]
GET 
https://www.google-analytics.com/analytics.js [HTTP/2.0 304 Not Modified 25ms]
Panel Data : 11777 core-13fc51d6.js:451:130
GET 
https://www.google-analytics.com/collect [HTTP/2.0 200 OK 23ms]
Strict-Transport-Security: The site specified a header that could not be parsed successfully.[Learn More] data
Error in parsing value for 'height'.  Declaration dropped.

I can’t see any bugs in Chrome. Is Firefox just super fussy or what?

it’s not us who are ‘that’ users, it’s the technology which is ‘that’

1 Like

Yes, Firefox seems super fussy!
I have both the native Firefox debugger and Firebug installed and only firefox’s native one is showing what you’ve listed.
Safari (Version 9.1.1 ) desktop has no qualms and neither does the latest version for iPhone.

Looking at the video I took from when my phone was crashing it looks like it was something in the core-fdc0888e.js (on staging) that was the trigger. Because it was crashing the timeline log and errors weren’t being preserved. However, if i scrub the playhead I don’t see any flags pop up with the warning or errors on the top though.

I’ve used -webkit-transitions a fair bit in my work without any problems before.

1 Like

And just to confirm, my friend has upgraded his iPhone OS and now the bug is fixed. So at least we have a fix.

1 Like