Title: Image rendering problem
Last modified: January 7, 2017

---

# Image rendering problem

 *  Resolved [gbengalex](https://wordpress.org/support/users/gbengalex/)
 * (@gbengalex)
 * [9 years, 5 months ago](https://wordpress.org/support/topic/image-rendering-problem/)
 * From the day when I installed abovethefold plugin I noticed that frequently when
   a user hits my homepage they see content texts but not the post thumbnail images
   or the video frame images. Often you have to refresh/clear browser once or more
   times for the images to render. Naturally this has increased my bounce rate. 
   I have disabled third-party plugins one-by-one to isolate the culprit and only
   when I disabled abovethefold is the issue resolved. It is a great plugin but 
   is this a known issue and is there a solution, maybe in the settings?

Viewing 5 replies - 1 through 5 (of 5 total)

 *  Plugin Author [optimalisatie](https://wordpress.org/support/users/optimalisatie/)
 * (@optimalisatie)
 * [9 years, 5 months ago](https://wordpress.org/support/topic/image-rendering-problem/#post-8630050)
 * Hi gbengalex,
 * I am suspecting that the problem is related to critical CSS (is the problem visible
   in the quality test?) or by a (complex) javascript render problem. It would be
   best to first check the critical CSS as that would cost less time.
 * The problem with async loading javascript is the following: when loading scripts
   async the moment of execution will differ per visitor, sometimes the download
   is fast and the execution is before the HTML is completely loaded, sometimes 
   the execution is after the HTML (and other scripts) are loaded. In this complex
   situation problems and conflicts may occur.
 * Most problems can be solved by reducing complexity. For example, when scripts
   are combined into 1 file there is less risk of conflicts between scripts. If 
   there is a problem with the moment of script execution it is possible to use 
   a dom-ready callback (for example `jQuery(function($){ ... });`) to control the
   moment of execution.
 * Some scripts may not be async compatible by default, for example many Google 
   API scripts such as Google Maps and Google AdSense do not support async loading.
   In that case the script could be excluded from the javascript load optimization
   or modified to support async loading. For example, Google offers an async version
   for Google AdSense:
 * [https://support.google.com/adsense/answer/3221666?hl=en](https://support.google.com/adsense/answer/3221666?hl=en)
 * I hope that this information is helpful!
 * If you find a solution we appreciate it if you share it in this topic.
 * _[ [Signature moderated](http://codex.wordpress.org/Forum_Welcome#Signatures)]_
    -  This reply was modified 9 years, 5 months ago by [Jan Dembowski](https://wordpress.org/support/users/jdembowski/).
 *  Thread Starter [gbengalex](https://wordpress.org/support/users/gbengalex/)
 * (@gbengalex)
 * [9 years, 5 months ago](https://wordpress.org/support/topic/image-rendering-problem/#post-8631053)
 * Thank you Jan. I did not activate critical css because when I visited [https://jonassebastianohlsson.com/criticalpathcssgenerator/](https://jonassebastianohlsson.com/criticalpathcssgenerator/)
   and got to Step 2 (FULL CSS TO EXTRACT CRITICAL CSS FROM) I had no idea which
   css file on my site is to be copied in there. Please any idea what Step 2 is 
   asking for?
 *  Thread Starter [gbengalex](https://wordpress.org/support/users/gbengalex/)
 * (@gbengalex)
 * [9 years, 5 months ago](https://wordpress.org/support/topic/image-rendering-problem/#post-8631159)
 * I figured it out … but now the criticalcss.com server is down and throwing errors.
   Will keep trying and update.
 *  Thread Starter [gbengalex](https://wordpress.org/support/users/gbengalex/)
 * (@gbengalex)
 * [9 years, 5 months ago](https://wordpress.org/support/topic/image-rendering-problem/#post-8631795)
 * I added critical css but saw no difference at all in speed and performance
 *  Thread Starter [gbengalex](https://wordpress.org/support/users/gbengalex/)
 * (@gbengalex)
 * [9 years, 5 months ago](https://wordpress.org/support/topic/image-rendering-problem/#post-8631899)
 * I got the full css and then minified it on cssminifier.com into the following.
   Is that it?
 * <?php
    // setup the URL, the CSS and the form data $url = ‘[https://cssminifier.com/raw&#8217](https://cssminifier.com/raw&#8217);;
   $css = file_get_contents(‘./public/s/css/style.css’); $data = array( ‘input’ 
   => $css, );
 *  // init the request, set some info, send it and finally close it
    $ch = curl_init(
   $url);
 *  curl_setopt($ch, CURLOPT_POST, 1);
    curl_setopt($ch, CURLOPT_POSTFIELDS, $data);
   curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
 *  $minified = curl_exec($ch);
 *  curl_close($ch);
 *  // output the $minified
    echo $minified; ?>

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘Image rendering problem’ is closed to new replies.

 * ![](https://s.w.org/plugins/geopattern-icon/above-the-fold-optimization_fcfbf6.
   svg)
 * [Page Speed Optimization](https://wordpress.org/plugins/above-the-fold-optimization/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/above-the-fold-optimization/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/above-the-fold-optimization/)
 * [Active Topics](https://wordpress.org/support/plugin/above-the-fold-optimization/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/above-the-fold-optimization/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/above-the-fold-optimization/reviews/)

 * 6 replies
 * 2 participants
 * Last reply from: [optimalisatie](https://wordpress.org/support/users/optimalisatie/)
 * Last activity: [9 years, 5 months ago](https://wordpress.org/support/topic/image-rendering-problem/#post-8653881)
 * Status: resolved