{"id":252295,"date":"2022-08-01T12:34:33","date_gmt":"2022-08-01T12:34:33","guid":{"rendered":"https:\/\/www.webscale.com\/?p=252295"},"modified":"2023-12-29T15:43:14","modified_gmt":"2023-12-29T20:43:14","slug":"the-art-of-loading-your-magento-store-in-under-3-seconds","status":"publish","type":"post","link":"https:\/\/www.webscale.com\/blog\/the-art-of-loading-your-magento-store-in-under-3-seconds\/","title":{"rendered":"The art of loading your Magento store in under 3 seconds"},"content":{"rendered":"

Andrew Bouchard is the Head of Business Development at Ziffity Solutions LLC.<\/em><\/p>\n

Magento is a fully-loaded platform that offers all the essential and advanced features needed to manage your eCommerce operations. It\u2019s highly scalable, customizable, and integrates with any third-party system. However, on the flip side, these out-of-the-box features are a result of heavy coding, which often pose challenges for store owners in terms of performance.<\/p>\n

This blog provides the top Magento speed optimization tips and techniques that can help load your store in a flash.<\/p>\n

Load \u2018Above-the-Fold\u2019 contents<\/strong><\/h3>\n

\u2018Above-the-Fold\u2019 is the first fold of your web page that appears to the users. Allowing your web page to load only the first fold contents initially can help in the faster rendering of the content, thereby significantly reducing the waiting time. Here\u2019s how you can do that:<\/p>\n

Refrain JS from loading upfront<\/strong><\/em><\/p>\n

While a web page\u2019s contents load, the JavaScript also loads in parallel, competing with the contents increasing the time taken to render. By refraining Javascript from loading alongside the content, you prioritize what matters the most for users. Technically it\u2019s deferring the parsing of JS, which can be achieved by moving the code to the bottom of the page.<\/p>\n

Reduce page size<\/strong><\/h3>\n

Too many elements on a page can affect the loading speed significantly. It could be images, CSS, Javascript, catalogs, etc. Reducing page size matters more when it comes to the mobile experience as Google considers mobile web speed as one of the important ranking factors.<\/p>\n

Here are a few tips to reduce page size:<\/strong><\/p>\n

Gzip Compression<\/strong><\/em><\/p>\n

Using Gzip, you can compress your page to almost one-fourth of its size. This technique allows you to compress elements like fonts, JS, and CSS.<\/p>\n

CSS\/JS Minification and Merging<\/strong><\/em><\/p>\n

Magento allows you to execute CSS\/JS Minification which can help in reducing page weight. Here\u2019s how you should go about it:<\/p>\n

Login into your Magento backend. Go to Stores > Configuration > Advanced > Developer > JavaScript settings and enable minification.<\/p>\n

\u2018Default,\u2019 \u2018Developer,\u2019 and \u2018Production\u2019 are the three running modes in Magento. Choose the \u2018Production\u2019 mode as the minification works only in this mode.<\/p>\n

php bin\/magento deploy:mode:show<\/strong><\/p>\n

Run the command given below in the SSH terminal inside the Magento root folder to enable minification and turn your web application into production mode.<\/p>\n

php bin\/magento deploy:mode:set production<\/strong><\/p>\n

\"\"Here:<\/p>\n

\u2013 Set Merge JavaScript Files to \u2018Yes\u2019
\n\u2013 Minify JavaScript Files to \u2018Yes\u2019<\/p>\n

To minify CSS, go to the backend, Stores > Configuration > Advanced > Developer > CSS Settings. Here:<\/p>\n

\u2013 Set Merge CSS Files to \u2018Yes\u2019
\n\u2013 Set Minify CSS Files to \u2018Yes\u2019<\/p>\n

Click on \u2018Save Config\u2019 and flush cache to apply the changes when done.<\/p>\n

Advanced JS Bundling<\/strong><\/em><\/p>\n

Advanced JS Bundling is an improvisation of the Basic Bundling technique in Magento. It combines JavaScript packages into one large file, drastically reducing the number of requests.<\/p>\n

Advanced Bundling demands a page-specific approach. A page-wise approach helps retain only the needed JS files for that particular page. Advanced Bundling also enables you to load the CSS files before JavaScript.<\/p>\n

\"\"<\/p>\n

Optimize Time to First Byte (TTFB)<\/strong><\/h3>\n

TTFB is a technique used primarily for pages that hold information that have to be kept confidential. Such pages won\u2019t be cached by Magento\u2019s built-in full-page cache system and cannot be quickly rendered through a recently cached copy. The rest of the pages like category, product detail page etc. do not require TTFB.<\/p>\n

Audit third-party extensions<\/strong><\/h3>\n

Make a list of extensions used. Excluding the core Magento extensions, look out for third-party extensions developed by agencies or developers.<\/p>\n

Start inspecting by turning off extensions one by one, clearing caches, and checking for page speed impact. While doing so, check out the home page, category pages, product, and checkout pages. If you record an improvement in performance, you\u2019ve located the troubling extension. To perform audits on a regular basis, partner with a dedicated\u00a0Magento managed services<\/a>\u00a0provider.<\/p>\n

Upgrade Hosting Plan<\/strong><\/h3>\n

You can identify if there\u2019s a need to upgrade your hosting plan by comparing your live store with a copy of it in a similar server infrastructure. To test and identify areas of improvement you can sign up with a dedicated Cloud managed services provider.<\/p>\n

You can also go for cloud service providers like\u00a0Webscale<\/a>, one of the market-leading hosting solution providers optimized for Magento.<\/p>\n

Webscale can deliver the following advantages to your Magento store, among many others:<\/p>\n

\u2013 Predictive Autoscaling
\n\u2013 Top-notch security (PCI Level 1 compliance) \u2013 Better performance
\n\u2013 100% uptime (zero outages)
\n\u2013 Active monitoring
\n\u2013 Analytics for actionable insights
\n\u2013 Automated CD and CI\/CD
\n\u2013 Application testing<\/p>\n

Renowned brands like Dollar General, Unilever, Swarovski, Olympus and Puma etc. rely on Webscale for these services.<\/p>\n

Varnish or full page caching<\/strong><\/h3>\n

Varnish cache can accelerate loading time up to 25x. Varnish cache is a temporary storage facility that makes a copy of your web page. Instead of loading the entire web page from scratch, Varnish Cache renders a copy of that page thus reducing the loading time to milliseconds.<\/p>\n

You can activate Varnish cache by following the steps given below:<\/p>\n

Log into your Magento backend: Select \u2013\u00a0Stores > Configuration > Advanced > System > Full Page Cache<\/strong>. Now change the\u00a0\u2018Caching Application\u2019<\/strong>\u00a0field to\u00a0Varnish Cache<\/strong>.<\/p>\n

\"\"<\/p>\n

You can then access the \u2018Varnish Configuration\u2019 option to complete the process.<\/p>\n

Redis for Session Store and Database caching<\/strong><\/h3>\n

Redis does the job of database caching and session store. The data eviction system in Redis Cache (which can be configured), provides more control over database caching. With the control it offers, old data can be scheduled for automatic deletion to create space for new ones. By freeing up memory, your webpage\u2019s load time improves.<\/p>\n

Progressive Web Apps (PWAs)<\/strong><\/h3>\n

PWA replicates the experience of a native mobile app. Magento\u2019s in-house PWA SDK helps you build mobile-responsive web pages that load in a flash. Magento partner agencies offer PWA in their portfolio of\u00a0Magento development services<\/a>.<\/p>\n

Final Words<\/strong><\/h3>\n

Those are our high-priority tips for Magento loading speed optimization. You can start implementing these techniques right away. Ask your current Magento agency to help with the technicalities of executing these speed optimization tips.<\/p>\n","protected":false},"excerpt":{"rendered":"

Andrew Bouchard is the Head of Business Development at Ziffity Solutions LLC. Magento is a fully-loaded platform that offers all the essential and advanced features needed to manage your eCommerce operations. It\u2019s highly scalable, customizable, and integrates with any third-party system. However, on the flip side, these out-of-the-box features are a result of heavy coding, […]<\/p>\n","protected":false},"author":28,"featured_media":255632,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_et_pb_use_builder":"","_et_pb_old_content":"","_et_gb_content_width":"","rank_math_lock_modified_date":false,"_aioseo_description":"","_aioseo_keywords":"","_aioseo_og_article_section":"","_aioseo_og_article_tags":"","_aioseo_og_description":"","_aioseo_og_title":"","_aioseo_title":"","_aioseo_twitter_description":"","_aioseo_twitter_title":"","_author_photo":"field_6513304084a08","_doc_url":"","_dp_original":"","_et_autogenerated_title":"","_et_body_layout_enabled":"","_et_body_layout_id":"","_et_builder_dynamic_assets_loading_attr_threshold":"2","_et_builder_module_features_cache":null,"_et_builder_version":"","_et_default":"","_et_enabled":"","_et_footer_layout_enabled":"","_et_footer_layout_id":"","_et_header_layout_enabled":"","_et_header_layout_id":"","_et_pb_ab_current_shortcode":"","_et_pb_ab_subjects":"","_et_pb_built_for_post_type":"","_et_pb_custom_css":"","_et_pb_enable_shortcode_tracking":"","_et_pb_excluded_global_options":"","_et_pb_first_image":"","_et_pb_gutter_width":"","_et_pb_module_type":"","_et_pb_page_layout":"et_no_sidebar","_et_pb_page_z_index":"","_et_pb_post_hide_nav":"default","_et_pb_row_layout":"","_et_pb_show_page_creation":"","_et_pb_show_title":"on","_et_pb_side_nav":"off","_et_pb_static_css_file":"","_et_pb_truncate_post":"","_et_pb_truncate_post_date":"","_et_post_bg_color":"#ffffff","_et_post_bg_layout":"light","_et_template":[],"_et_theme_builder_marked_as_unused":"","_et_use_on":"","_gallery_link_target":"","_global_colors_info":"","_lh_copy_from_url-original_file":"","_version_history":"","_wp_old_date":["2022-08-01"],"_wpcode_auto_insert":"","_wpcode_auto_insert_number":"","_wpcode_conditional_logic":[],"_wpcode_conditional_logic_enabled":"","_wpcode_library_id":"","_wpcode_library_version":"","_wpcode_location_extra":"","_wpcode_note":"","_wpcode_priority":"","_wpcode_shortcode_attributes":[],"_wpmf_gallery_custom_image_link":"","ao_post_optimize":[],"author_photo":"255854","doc_url":"","et_enqueued_post_fonts":{"family":{"et-gf-lato":"Lato:100,100italic,300,300italic,regular,italic,700,700italic,900,900italic"},"subset":["latin","latin-ext"],"cache_key":"{\"gph\":0,\"divi\":\"4.24.1\",\"wp\":\"6.6.2\",\"enable_all_character_sets\":\"false\"}"},"rank_math_contentai_score":{"wordCount":"100","linkCount":"0","headingCount":"100","mediaCount":"62.22"},"rank_math_description":"Magento is a fully-loaded platform that offers all the essential and advanced features needed to manage your eCommerce operations. It\u2019s highly scalable, customizable","rank_math_facebook_image":"https:\/\/www.webscale.com\/wp-content\/uploads\/2022\/08\/Magento-speed-optimization-Banner-1-1.png","rank_math_facebook_image_id":"252304","rank_math_internal_links_processed":["1","1"],"rank_math_og_content_image":{"check":"88c93d874e6af6dc27fb9ae1fe7ed40d","images":[]},"rank_math_seo_score":"20","rank_math_title":"","version_history":"","wp-smpro-smush-data":[],"wp-smush-animated":"","wpmf_filetype":"","wpmf_order":"","wpmf_size":"","_":"","_bj_lazy_load_skip_post":[],"_divi_filters_post_type":"","_et_dynamic_cached_attributes":{"sticky_position":["top"],"use_custom_gutter":["on"],"fullwidth":["off"],"button_icon":["$||divi||400"],"social_network":["facebook","twitter","linkedin","youtube","last_fm"],"header_2_font":"|800|||||||","header_2_font_size":"34px","header_2_text_align":"center","animation_intensity_slide":"10%","animation_duration":"800ms","animation_delay":"15ms","animation_intensity_zoom":"15%","animation_intensity_flip":"15%","animation_intensity_fold":"15%","animation_intensity_roll":"15%","animation_direction":"center","animation_style":"none","background_color_gradient_start":"rgba(255,255,255,0)","background_color_gradient_end":"#fafafa","custom_padding":"120px||0px||false|false","background_color_gradient_stops":"rgba(255,255,255,0) 0%|#fafafa 100%","custom_padding_last_edited":"on|desktop","custom_padding_tablet":"||30px||false|false","custom_padding_phone":"60px||||false|false"},"_et_dynamic_cached_shortcodes":["et_pb_post_content","et_pb_contact_field","et_pb_signup_custom_field","et_pb_social_media_follow_network","et_pb_section","et_pb_row","et_pb_column","et_pb_blog","et_pb_blurb","et_pb_button","et_pb_code","et_pb_contact_form","et_pb_post_nav","et_pb_post_title","et_pb_signup","et_pb_social_media_follow","et_pb_text"],"_et_pb_ab_bounce_rate_limit":"","_et_pb_ab_stats_refresh_interval":[],"_et_pb_content_area_background_color":"","_et_pb_dark_text_color":"","_et_pb_light_text_color":"","_et_pb_section_background_color":"","_job_location":"","_job_locations":"","_links_to":"","_links_to_target":"","_product_image_gallery":"","_schema_code":"","_synced_version":"","_wp_attachment_context":"","_wp_attachment_image_alt":[],"_wpie_source_url":"","_yoast_wpseo_content_score":"30","_yoast_wpseo_focuskeywords":"[]","_yoast_wpseo_metadesc":"Magento is a fully-loaded platform that offers all the essential and advanced features needed to manage your eCommerce operations. It\u2019s highly scalable, customizable","_yoast_wpseo_opengraph-image":"https:\/\/www.webscale.com\/wp-content\/uploads\/2022\/08\/Magento-speed-optimization-Banner-1-1.png","_yst_prominent_words_version":"1","inline_featured_image":["0"],"job_location":[],"job_locations":"","options":"","original-file":"","post_views_count":"","rank_math_analytic_object_id":"1758","rank_math_canonical_url":"","rank_math_focus_keyword":[],"rank_math_news_sitemap_robots":"index","rank_math_primary_category":"0","rank_math_primary_ccategory":"","rank_math_primary_job_locations":"","rank_math_primary_partners_category":"","rank_math_primary_pr_category":"","rank_math_primary_press_release_year":"","rank_math_rich_snippet":"","rank_math_robots":["index"],"rank_math_schema_Article":[],"rank_math_schema_Organization":[],"rank_math_schema_VideoObject":[],"rank_math_shortcode_schema_s-23675683-fff5-4300-88fe-da8afc8b1bb9":"","rank_math_shortcode_schema_s-307bbc91-c6b1-41aa-950d-c50d435a949c":"","rank_math_shortcode_schema_s-63a052dbc0384":"","rank_math_shortcode_schema_s-63a052dbc039d":"","rank_math_shortcode_schema_s-63a052dbc03a6":"","rank_math_shortcode_schema_s-63a052dbc03aa":"","rank_math_shortcode_schema_s-63a052dbc03b5":"","rank_math_shortcode_schema_s-63a052dbc03ba":"","rank_math_shortcode_schema_s-63a052dbc03bd":"","rank_math_shortcode_schema_s-63b6dd7d53a96":"","rank_math_shortcode_schema_s-63b6dd7d53a9f":"","rank_math_shortcode_schema_s-63b6dd7d53aa2":"","rank_math_shortcode_schema_s-63b6dd7d53aa4":"","rank_math_shortcode_schema_s-63b6dd7d53aa7":"","rank_math_shortcode_schema_s-63b6dd7d53aa9":"","rank_math_shortcode_schema_s-63b6dd7d53aab":"","rank_math_shortcode_schema_s-63b6dd7d53aad":"","rank_math_shortcode_schema_s-63b6dd7d53aaf":"","rank_math_shortcode_schema_s-63c15fcf43311":"","rank_math_shortcode_schema_s-63c15fcf43322":"","rank_math_shortcode_schema_s-63c15fcf43325":"","rank_math_shortcode_schema_s-63c15fcf43327":"","rank_math_shortcode_schema_s-63c15fcf43329":"","rank_math_shortcode_schema_s-63c15fcf4332a":"","rank_math_shortcode_schema_s-63c15fcf4332c":"","rank_math_shortcode_schema_s-63c15fcf4332e":"","rank_math_shortcode_schema_s-63c15fcf43330":"","rank_math_shortcode_schema_s-63f52c5ed40bb":"","rank_math_shortcode_schema_s-6409f40a9b7d5":"","rank_math_shortcode_schema_s-64354a3892419":"","rank_math_shortcode_schema_s-6440158136148":"","rank_math_shortcode_schema_s-6446d2f9353ee":"","rank_math_shortcode_schema_s-6446d2f9353f3":"","rank_math_shortcode_schema_s-6447c0fe4673c":"","rank_math_shortcode_schema_s-64e4d743542d7":"","schema_code":"","smush-complete":"","smush-info":"","smush-stats":[],"synced_version":"","wpmf_remote_video_link":"","_exp":"","_inc":"","_mc4wp_settings":[],"_post-subtitle":"","_pwh_dcfh_contact_email":"","_pwh_dcfh_contact_form_id":"","_pwh_dcfh_form_fields":"","_pwh_dcfh_ip_address":"","_pwh_dcfh_page_id":"","_pwh_dcfh_read_by":"","_pwh_dcfh_referer_url":"","_pwh_dcfh_user_agent":[],"_section1_col1":"","_section1_col2":"","_section1_col3":"","_section1_col4":"","_section2_col1":"","_section2_col2":"","_section2_col3":"","_section2_col4":"","_section2_col5":"","_section2_col6":"","_section3_col1":"","_section3_col2":"","_section3_col3":"","_section3_col4":"","_section3_col5":"","_section3_col6":"","_section4_col1":"","_section4_col2":"","_section4_col3":"","_section4_col4":"","_section4_col5":"","_section4_col6":"","_section5_col1":"","_section5_col2":"","_section5_col3":"","_section5_col4":"","_section5_col5":"","_section5_col6":"","_section6_col1":"","_section6_col2":"","_section6_col3":"","_section6_col4":"","_section6_col5":"","_section6_col6":"","_select_author":"","_test":"","_wp_attachment_backup_sizes":[],"_yoast_wpseo_estimated-reading-time-minutes":[],"_yoast_wpseo_focuskw":[],"_yoast_wpseo_focuskw_text_input":[],"_yoast_wpseo_linkdex":[],"_yoast_wpseo_meta-robots-nofollow":[],"_yoast_wpseo_meta-robots-noindex":[],"_yoast_wpseo_primary_category":[""],"_yoast_wpseo_title":[],"_yoast_wpseo_wordproof_timestamp":"","exp":"","inc":"","post-subtitle":[],"rank_math_schema_BlogPosting":[],"section1_col1":"","section1_col2":"","section1_col3":"","section1_col4":"","section2_col1":"","section2_col2":"","section2_col3":"","section2_col4":"","section2_col5":"","section2_col6":"","section3_col1":"","section3_col2":"","section3_col3":"","section3_col4":"","section3_col5":"","section3_col6":"","section4_col1":"","section4_col2":"","section4_col3":"","section4_col4":"","section4_col5":"","section4_col6":"","section5_col1":"","section5_col2":"","section5_col3":"","section5_col4":"","section5_col5":"","section5_col6":"","section6_col1":"","section6_col2":"","section6_col3":"","section6_col4":"","section6_col5":"","section6_col6":"","select_author":"","test":"","footnotes":""},"categories":[1,25,10],"tags":[],"class_list":["post-252295","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blog","category-magento-adobe","category-performance"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.webscale.com\/wp-json\/wp\/v2\/posts\/252295"}],"collection":[{"href":"https:\/\/www.webscale.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.webscale.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.webscale.com\/wp-json\/wp\/v2\/users\/28"}],"replies":[{"embeddable":true,"href":"https:\/\/www.webscale.com\/wp-json\/wp\/v2\/comments?post=252295"}],"version-history":[{"count":0,"href":"https:\/\/www.webscale.com\/wp-json\/wp\/v2\/posts\/252295\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.webscale.com\/wp-json\/wp\/v2\/media\/255632"}],"wp:attachment":[{"href":"https:\/\/www.webscale.com\/wp-json\/wp\/v2\/media?parent=252295"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.webscale.com\/wp-json\/wp\/v2\/categories?post=252295"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.webscale.com\/wp-json\/wp\/v2\/tags?post=252295"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}