0

My Rails app is having trouble loading in Chrome although it seems to work fine in Safari and Firefox. It only has issues on particular pages, for example:

http://buildinprogress.media.mit.edu/projects/2239/steps

$(window).load(function(){}); does not seem to be reached as the code within it (that removes the loading animation) is not executed.

Does anyone have any ideas on how to fix this?

scientiffic
  • 8,169
  • 13
  • 68
  • 138
  • You could put a script in the footer so you know the page is loaded. – CWitty Jan 20 '15 at 22:57
  • its waiting on images, lots of images... – dandavis Jan 20 '15 at 23:01
  • I don't see the script you are referring to which I am assuming is supposed to remove the #loading div. EDIT: nevermind found it below the google analytics stuff – jvanstry Jan 20 '15 at 23:10
  • I would play around with the google analytics, try moving the code you wrote into its own script tag above the google stuff. It seems like aws stops responding after the analytics request comes back and, as you stated, the jQuery $(window).load function never gets called. – jvanstry Jan 20 '15 at 23:19
  • @dandavis the strange thing is that it does wait on images, but it seems to load them eventually in safari and firefox. not in chrome, though. – scientiffic Jan 21 '15 at 00:46
  • @jvanstry I placed the google analytics code at the bottom but it's still not loading – scientiffic Jan 21 '15 at 01:03
  • @scientiffic I opened in safari and sure enough it eventually loaded. Found a corresponding image request that failed in chrome and found the only difference in request headers was that chrome's request included "Accept: image/webp,*/*;q=0.8" while safari's was blank. Seems like this is not your problem as chrome is willing to accept anything (*/*) and the response does comeback with a (would be) matching "image/jpeg" in safari. I'd prob start investigating default browser behavior... especially the keep-alive header. EDIT: there are supposed to be asterisks on either side of both slashes. – jvanstry Jan 21 '15 at 01:39
  • Related: [HTML5 video strange rendering error in Chrome Ask Question](https://stackoverflow.com/q/30091457/55075). – kenorb Oct 22 '17 at 22:32
  • Possible duplicate of [HTML5 video element request stay pending forever (on chrome)](https://stackoverflow.com/questions/16137381/html5-video-element-request-stay-pending-forever-on-chrome) – kenorb Oct 22 '17 at 22:34

1 Answers1

0

It turned out that it was an image and video loading issue. To fix it, I implemented lazy loading for bootstrap carousel images and videos that weren't the default image.

scientiffic
  • 8,169
  • 13
  • 68
  • 138