Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
?
Solved

magento slow in IE when calling product images

Posted on 2011-10-17
6
Medium Priority
?
522 Views
Last Modified: 2012-05-12
Hello,

you can check out a test page at www.detail-collection.be/shop 
The page runs slow ONLY in IE because of the right column ( "recent toegevoegd" and "meest verkochte" ) thumbnails.

the code i use to generate those images is almost identical to that on the catagory view, wich also displays the images but does not run slow in IE!

this is the code i use to generate those 2 lists

 
<?php
$_productCollection = Mage::getResourceModel('reports/product_collection')
                    ->addAttributeToSelect('*')
                    ->setVisibility(array(2,3,4))                   
                    ->setOrder('created_at', 'desc')
                    ->setPage(1, 5);
?>



<div class="block callout">
    <div class="block-title">
        <strong><span><?php echo "Recent toegevoegd" ?></span></strong>
    </div>
<div class="block-content">
 
<table id="upsell-product-table">
		
<tr>
		<td>
	<?php foreach($_productCollection as $_product) : ?>
		<a class="product-image" href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image', null, true)) ?>">
    <img src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image'); ?>" alt="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image', null, true)) ?>" title="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image', null, true)) ?>" /></a>
  <?php endforeach; ?>
		</td>
</tr>

</table>

</div>
    </div>


<?php

$_mostsold = Mage::getResourceModel('reports/product_collection')
                   ->addAttributeToSelect('*')
                   ->setVisibility(array(2,3,4));

$select = $_mostsold->getSelect();

$sqlSelectColumns =  $select->getPart('columns');
$sqlSelectColumns[] = array(
            '',
            new Zend_Db_Expr('(
                SELECT SUM(order_item.qty_invoiced - order_item.qty_refunded)
                FROM ' . Mage::getSingleton('core/resource')->getTableName('sales/order_item') . ' AS order_item
                WHERE order_item.product_id = e.entity_id)
            '),
            'ordered_qty'
        );
$select->setPart('columns', $sqlSelectColumns);

$_mostsold->setOrder('ordered_qty', 'desc');
$_mostsold->setPage(1, 5);

?>
										

<div class="block callout">
    <div class="block-title">
        <strong><span><?php echo "Meest verkocht" ?></span></strong>
    </div>
<div class="block-content">
 
<table id="upsell-product-table">
		
<tr>
		<td>
		<?php foreach($_mostsold as $_product) : ?>
			<a class="product-image" href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image', null, true)) ?>">
      <img src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image'); ?>" alt="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image', null, true)) ?>" title="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image', null, true)) ?>" /></a>
    <?php endforeach; ?>
		</td>
</tr>

</table>

</div>
    </div>

Open in new window


does anyone have any id what i might be doing wrong for it to lag so much in IE.
When using FF it all works fine.
0
Comment
Question by:Th0R
  • 5
6 Comments
 

Author Comment

by:Th0R
ID: 36979418
i just noticed the problem does not show in IE 9, but in IE 8
0
 
LVL 16

Expert Comment

by:hankknight
ID: 36983290
Really, the solution to problem is more related to HTML and JavaScript than PHP.  The problem is that older versions of IE wait to display a table until everything in the table has loaded.  

I would change this:
<img src

to this:

<img longdesc

And then use JavaScript to turn the longdesc into src after the page fully loads.

Give the code below a try, and if it loads faster, ask the folks in the JavaScript channel how to turn the longdesc back into src.  I know how to do this using jQuery but Magento uses a different JavaScript framework.
<?php
$_productCollection = Mage::getResourceModel('reports/product_collection')
                    ->addAttributeToSelect('*')
                    ->setVisibility(array(2,3,4))                   
                    ->setOrder('created_at', 'desc')
                    ->setPage(1, 5);
?>



<div class="block callout">
    <div class="block-title">
        <strong><span><?php echo "Recent toegevoegd" ?></span></strong>
    </div>
<div class="block-content">
 
<table id="upsell-product-table">
		
<tr>
		<td>
	<?php foreach($_productCollection as $_product) : ?>
		<a class="product-image" href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image', null, true)) ?>">
    <img longdesc="<?php echo $this->helper('catalog/image')->init($_product, 'small_image'); ?>" alt="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image', null, true)) ?>" title="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image', null, true)) ?>" /></a>
  <?php endforeach; ?>
		</td>
</tr>

</table>

</div>
    </div>


<?php

$_mostsold = Mage::getResourceModel('reports/product_collection')
                   ->addAttributeToSelect('*')
                   ->setVisibility(array(2,3,4));

$select = $_mostsold->getSelect();

$sqlSelectColumns =  $select->getPart('columns');
$sqlSelectColumns[] = array(
            '',
            new Zend_Db_Expr('(
                SELECT SUM(order_item.qty_invoiced - order_item.qty_refunded)
                FROM ' . Mage::getSingleton('core/resource')->getTableName('sales/order_item') . ' AS order_item
                WHERE order_item.product_id = e.entity_id)
            '),
            'ordered_qty'
        );
$select->setPart('columns', $sqlSelectColumns);

$_mostsold->setOrder('ordered_qty', 'desc');
$_mostsold->setPage(1, 5);

?>
										

<div class="block callout">
    <div class="block-title">
        <strong><span><?php echo "Meest verkocht" ?></span></strong>
    </div>
<div class="block-content">
 
<table id="upsell-product-table">
		
<tr>
		<td>
		<?php foreach($_mostsold as $_product) : ?>
			<a class="product-image" href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image', null, true)) ?>">
      <img longdesc="<?php echo $this->helper('catalog/image')->init($_product, 'small_image'); ?>" alt="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image', null, true)) ?>" title="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image', null, true)) ?>" /></a>
    <?php endforeach; ?>
		</td>
</tr>

</table>

</div>
    </div>

Open in new window

0
 

Author Comment

by:Th0R
ID: 36988586
well its not about slow loading times, rather slow scrolling speeds.
Even when everything on the site is loaded it lags when scrolling.
So correct me if i'm wrong, its not a loading problem.
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 

Accepted Solution

by:
Th0R earned 0 total points
ID: 37378190
i finnaly found an easy working solution for my problem.

the problem was because the customer was uploading gigantic jpg files to his products.

changing

<img src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image'); ?>

to

    <img src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->resize(85?>;

did the trick
0
 

Author Closing Comment

by:Th0R
ID: 37398797
time solves all problems :)
0
 

Author Comment

by:Th0R
ID: 37378200
edit: forgot the ) at the end of ->resize(85

so make that

    <img src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->resize(85)?>;
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Recursive SQL is one of the most fascinating and powerful and yet dangerous feature offered in many modern databases today using a Common Table Expression (CTE) first introduced in the ANSI SQL 99 standard. The first implementations of CTE began ap…
Ranking ecommerce websites is a vital process. You need to have a strong SEO (Search Engine Optimization) strategy. If you don’t have one, you are losing out on brand impressions, clicks and sales. Check this guide on how to improve website traffic …
Viewers will get an overview of the benefits and risks of using Bitcoin to accept payments. What Bitcoin is: Legality: Risks: Benefits: Which businesses are best suited?: Other things you should know: How to get started:
You have products, that come in variants and want to set different prices for them? Watch this micro tutorial that describes how to configure prices for Magento super attributes. Assigning simple products to configurable: We assigned simple products…
Suggested Courses

564 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question