- This topic has 11 replies, 2 voices, and was last updated 4 years, 3 months ago by
.
-
Posts
-
Up0Hi, I am trying to optimizing the site speed.
GTMetrix tests are pretty bad. For the “Serve Scaled Images” score I got an F, so then I downloaded the Imagify. However, when I contacted their support, they said it’s a theme issue (not on their end).Your theme loads larger image sizes and resizes the appearance of those images through HTML and/or CSS attributes. This results in the browser downloading a larger image file than the dimensions actually applied displaying the image. See their response below. Can someone advise me on what I should do?
A solution would be for the theme to provide a selection of different image sizes for the browser to choose from, or (if that’s not possible, for example for CSS background images), to serve the image in a smaller size that would fit its actual presentation.
This type of issue is not related to Imagify; it should be addressed by the theme provider.
Hi @tacet22,
Thank you for your feedback.
Which images are exactly the issue please? Could you point us to the areas in which images are too big for for their display?
Thank you.
I’m assuming every image?
I ran my website through GTMetrix because the theme is slow (there are other threads relating to this), and I’m trying to fix each issue. See the attachment for the result.GTMetrix says “Serve scaled images” is one of the key issues and then when I did more research on this, the recommendation was to use Imagify plugin. However, they said the issue is on the Theme’s end.
Unfortunately, this is not helping us to find the root cause of your image issues. Please also note that if you have uploaded large images on your website, in your section widgets or in your hero for instance, this is forcing your browser to resize the image. This is not directly related with our theme as it has more to do with the uploaded content itself.
Just to be sure, could you share the URL to the website pages that you’ve tested with GTMetrix with us please? You can post it in your next reply and mark it as private to keep this between us.
Thank you.
This reply has been marked as private.
Thank you for sharing this with us!
As mentioned above, the issue is more related with the uploaded content than the theme itself. Our theme allows you to display large image that will be resized by your browser if those are too big but we encourage you to select smaller images and lighter image files. From what we see on your pages, you’ve uploaded very large images, which make your page loading time longer.In your case, the only solution is to force WP to crop your background image to a smaller image ratio set by our theme (1800x550px) and use those smaller images instead. This might not be ideal for some images as you won’t able to select the displayed image area unless you add third party plugins. The good news is that it should solve your issue with Imagify, allowing you to improve image loading and performances.
To force this behavior, simply add the following code snippet to your website:
/** * Resetting default image sizes for section widgets. */ function gwangi_custom_change_section_widget_background_image_size() { global $gwangi_grimlock; remove_filter( 'grimlock_section_widget_background_image_size', array( $gwangi_grimlock, 'change_section_widget_background_image_size' ), 10 ); } add_action( 'after_setup_theme', 'gwangi_custom_change_section_widget_background_image_size', 10 );To add this code snippet to your site, we recommend that you use a the Code Snippets plugin (https://wordpress.org/plugins/code-snippets/). If you have never activated this plugin, please read the following post:
Please also note that we don’t provide any theme customization. So, you shouldn’t expect other snippets from us unless it’s to fix an issue stemming from our own codebase. We always try our best to help theme users whenever we can and only provide code snippets out of courtesy to prevent them from waiting for the next update.
Regards,
Hi, I followed these instructions, but GTMetrix still shows a score of F.
I added the code snippet plugin (screenshot) and clicked saved changes
I also have Imagify plugin.Any ideas on what I should do next?
@tacet22, Do you have Grimlock Animate activated and do you wish to keep it ?
I deactivated it and there’s no improvement in speed.
@tacet22 Thank you for confirming this, but I still don’t see any changes in the sizes of your pictures. Did you also remove the snippet shared above?
Deactivating Grimlock Animate and using the snippet will let Imagify do its work. Furthermore, removing Grimlock Animate will remove extra JS scripts and CSS styles to load, which should minimize the size of your page.
Please note that I took the liberty to move this topic to our Feature Requests forum. As creating a new option to force the appropriate background image size for the Grimlock section widgets could be a nice addition to our framework, we will implement this feature in the next update.
Hi @tacet22,
It took us quite some time but we’ve made two recent Grimlock updates (v 1.3.5 and v 1.3.6) that should improve this issue.
After the update, you should find some performance improvements related with this issue. However, you might still be seeing the issue because your browser cache is showing you an older version of the page (browsers do that to load pages faster). To see that the issue is resolved you will need to empty your browser cache and reload the page. If you want to read more on what browser cache is and how to clear it, here is an article that might help you:
https://www.lifewire.com/how-to-clear-cache-2617980Kindest regards,
The topic ‘Serve scaled images?’ is closed to new replies.
