3 Replies Latest reply on Jan 22, 2014 9:51 AM by WLockIV

    Website loading slow and preloader not loading

    alexmathayes

      Hi!

       

      I'm currently working on a site which is almost 95% complete. The loading time for the site is approx 7-10 seconds which seems to be slow. I have placed a preloader but that doesn't seem to be coming up while the site is loading.

       

      Is there anyway to speed up the loading time. Like some code that will tell it load specific number of frames first and then load the rest in the background?

       

      I have compressed the images that are being used but cannot compress further as they may lose the quality.

       

       

      EDIT: I've got the preloader working and now it seems to be showing up while the site is loading. Is there any way to speed up the loading time.

       

      Message was edited by: alexmathayes

        • 1. Re: Website loading slow and preloader not loading
          WLockIV Level 1

          How did you manage to get the preloader to work? I am having a similar issue.

           

          For your loading time, something you should do is add up the total amount of data that your animation needs to load before it can kick off. This is your .js files, and all of the image files associated. Use the "Save for Web" function in Photoshop and Illustrator, and try to make sure that they aren't any bigger in resolution than what you'll need them to be when displaying on your site.    

          • 2. Re: Website loading slow and preloader not loading
            alexmathayes Level 1

            I've already compressed the images much and in case I compress any further they will lose quality. They have been saved as 'save for web'.

             

            Regarding getting the preloader working I followed the video mentioned below:

            http://www.youtube.com/watch?v=6BzhXxn7NLA

             

            Once I got the preloader centered I edited this code in the html file which is published by adobe edge. The edited/added portion has been highlighted as bold:

            <body style="margin:0;padding:0;height:100%;overflow:hidden; background-color:#333;">

             

            And the preloader was working while the site was loading up.

             

            In case if you have any other suggestion to speed up the site loading time, lemme know.

             

            The site is complete and can be seen here: http://www.SheenWynds.com

             

            The entire site is around 3MB and has total of 10 different backgrounds (each between 80kb to 110kb) and other images also along with the content.

            • 3. Re: Website loading slow and preloader not loading
              WLockIV Level 1

              The site only took about 3 seconds to load for me, but there are a couple of things I would do to improve the image quality.

               

              First, I would adjust the stage dimensions so it stays proportional. Right now, the animation is loading at whatever size the browser window is, and that is causing the rest of the imaged to stretch. Having a smaller stage with some blank space around is a lot better than having a 100%x100% stage that has everything stretched.

               

              If you want to improve image quality and reduce load time, split the animation up into different web pages. It would take away some of the transitions between categories, but the application would only need to load one peice at a time.

              1 person found this helpful