{"id":4232,"date":"2019-12-09T14:35:41","date_gmt":"2019-12-09T09:05:41","guid":{"rendered":"https:\/\/www.idslogic.com\/blog\/?p=4232"},"modified":"2025-02-24T12:42:06","modified_gmt":"2025-02-24T07:12:06","slug":"ids-logic-now-has-an-improved-website-loading-speed-and-performance-heres-how","status":"publish","type":"post","link":"https:\/\/www.idslogic.com\/blog\/ids-logic-now-has-an-improved-website-loading-speed-and-performance-heres-how","title":{"rendered":"IDS Logic Now has an Improved Website Loading Speed and Performance: Here\u2019s How"},"content":{"rendered":"<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_72 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of Contents<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/www.idslogic.com\/blog\/ids-logic-now-has-an-improved-website-loading-speed-and-performance-heres-how\/#The_Reason_Behind_Our_Rework\" title=\"The Reason Behind Our Rework!\">The Reason Behind Our Rework!<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/www.idslogic.com\/blog\/ids-logic-now-has-an-improved-website-loading-speed-and-performance-heres-how\/#Here_is_What_we_did_to_Fix_the_Issues_and_Boost_the_Performance_of_Our_Site\" title=\"Here is What we did to Fix the Issues and Boost the Performance of Our Site\">Here is What we did to Fix the Issues and Boost the Performance of Our Site<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/www.idslogic.com\/blog\/ids-logic-now-has-an-improved-website-loading-speed-and-performance-heres-how\/#Our_Achievements_after_Making_the_Essential_Changes_in_Our_Website\" title=\"Our Achievements after Making the Essential Changes in Our Website\">Our Achievements after Making the Essential Changes in Our Website<\/a><\/li><\/ul><\/li><\/ul><\/nav><\/div>\n<p><span style=\"font-size: 14pt;\">Our business website has always been the gateway through which we offer our services to the customers globally.\u00a0 Having observed that the buyer\u2019s behaviour is continuously evolving and they are becoming impatient day by day, we couldn\u2019t afford to overlook the importance of website load speed and its performance. Though our website had a great design, relevant content and good performance, but we were targeting to be the best in the market and wanted our site to load within 2 seconds of time.<\/span><\/p>\n<h2><span class=\"ez-toc-section\" id=\"The_Reason_Behind_Our_Rework\"><\/span><span style=\"font-size: 18pt; color: #008000;\"><strong>The Reason Behind Our Rework!<\/strong><\/span><span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p><span style=\"font-size: 14pt;\">Our team knew the fact that a slow website will deter the users and will force them to move to our competitor\u2019s site. Since 47% of the internet users expect a site to load within 2 seconds or less and 40% abandon a site if it takes longer than 3 seconds, it was our target to highly optimise the site to offer the best experience to our users. Every extra second that the site took to load lead to 11% loss in page views and 7% fewer conversion.<\/span><\/p>\n<p><span style=\"font-size: 14pt;\">A decrease in the website loading time from 5 seconds to 2 seconds would surely help us in attaining a good ranking in the search engines, attract more traffic to the site, keep the customers engaged and satisfied and of course help us increase our revenues. But the first thing that we had to do is analyse our website to understand the loop holes, so that we could work on them.<\/span><\/p>\n<h3><span class=\"ez-toc-section\" id=\"Here_is_What_we_did_to_Fix_the_Issues_and_Boost_the_Performance_of_Our_Site\"><\/span><span style=\"font-size: 16pt; color: #003366;\"><strong>Here is What we did to Fix the Issues and Boost the Performance of Our Site<\/strong><\/span><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><span style=\"font-size: 14pt;\">For the front end strategy and to automate and enhance the workflow, our developers used the Gulp Task Runner. Gulp is a cross platform, streaming task runner, which allows the developers to automate various development processes and task.\u00a0 Gulp reads the files as pipes and streams and the tasks are code based and use various plugins. The task runner helped us with<\/span><\/p>\n<ul>\n<li><span style=\"font-size: 14pt;\">Image optimisation<\/span><\/li>\n<li><span style=\"font-size: 14pt;\">CSS pre-processing<\/span><\/li>\n<li><span style=\"font-size: 14pt;\">Minimisation and concatenation of CSS and JavaScript files<\/span><\/li>\n<\/ul>\n<p><span style=\"font-size: 14pt;\">The advantage of using Gulp is that at the end we had cleaner and easy to read task files having great consistency between task.<\/span><\/p>\n<p><span style=\"font-size: 14pt;\">Next, our team decided to choose SCSS so that we could compress several lines of code in the SASS syntax to reduced number of lines of SCSS. Sassy CSS is much like CSS, but with better formatting and is a superset of CSS3\u2019s syntax. It is by using SCSS, that we could add many additional functionalities to the CSS like variables, nesting and etc. All such additional functionalities made writing CSS easier and faster as compared to writing using the traditional CSS. The standard lines were compressed and it allows to improve the internal structure without altering the external behaviour of the code.<\/span><\/p>\n<blockquote>\n<p style=\"box-shadow: 0 0 16px #cccccc; padding: 10px;\"><span style=\"font-size: 14pt;\"><span style=\"color: #003366;\"><strong>Also Read: <\/strong><a href=\"\/blog\/how-to-boost-up-your-magento-website-speed-and-improve-performance\"><span style=\"color: #ff0000;\">How to Boost Up Your Magento Website Speed and Improve Performance?<\/span><\/a><\/span><\/span><\/p>\n<\/blockquote>\n<p><span style=\"font-size: 14pt;\">With responsive design, the images often need to be used with a variety of dimensions. Though there are numerous approaches to address this, we chose to optimise the images and the icons by using SVG, which helped us to reduce the file size on the website. It is a file format that allows you to scale an image up or down as needed. Smaller file size of course helped us to deal with higher resolution screens and ultimately contributed in quick loading of the site.<\/span><\/p>\n<p><span style=\"font-size: 14pt;\">Using inline SVG has helped us to enhance the performance of the site as it eliminates the HTTP request, which is needed to load an image file. Since there is no need to download the files, it results in reduced loading time for a page, thereby making the website appear faster to the visitors and improving the user experience.<\/span><\/p>\n<p><span style=\"font-size: 14pt;\">We have also used the concept of lazy loading where the entire web page does not load in one go as in bulk loading. It loads the web content or the images when it is needed rather than all at once.<\/span><\/p>\n<p><span style=\"font-size: 14pt;\">Our development team has also integrated the ACF WordPress plugin which helps us to add extra content fields. This gave us the potential to have highly customisable and manageable templates, that is not there in the WordPress by default.<\/span><\/p>\n<h3><span class=\"ez-toc-section\" id=\"Our_Achievements_after_Making_the_Essential_Changes_in_Our_Website\"><\/span><span style=\"font-size: 16pt; color: #003366;\"><strong>Our Achievements after Making the Essential Changes in Our Website<\/strong><\/span><span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><span style=\"font-size: 14pt;\">After making the changes, we observed that there was significant improvement in the speed and performance of the website. The site loaded very fast, which improved the visitor\u2019s experience, helped us to reach our marketing goals, attract more traffic to the site, and meet the needs of the consumers.<\/span><\/p>\n<p><span style=\"font-size: 14pt;\">Thus to conclude, the overall performance of our site increased, which ultimately lead to happy and satisfied customers and higher revenues for us.<\/span><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Our business website has always been the gateway through which we offer our services to the customers globally.\u00a0 Having observed that the buyer\u2019s behaviour is continuously evolving and they are becoming impatient day by day, we couldn\u2019t afford to overlook&#8230;<\/p>\n","protected":false},"author":1,"featured_media":4233,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[979,980],"class_list":["post-4232","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-uncategorized","tag-website-speed-improvement","tag-website-speed-optimization"],"post_mailing_queue_ids":[],"_links":{"self":[{"href":"https:\/\/www.idslogic.com\/blog\/wp-json\/wp\/v2\/posts\/4232","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.idslogic.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.idslogic.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.idslogic.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.idslogic.com\/blog\/wp-json\/wp\/v2\/comments?post=4232"}],"version-history":[{"count":2,"href":"https:\/\/www.idslogic.com\/blog\/wp-json\/wp\/v2\/posts\/4232\/revisions"}],"predecessor-version":[{"id":10458,"href":"https:\/\/www.idslogic.com\/blog\/wp-json\/wp\/v2\/posts\/4232\/revisions\/10458"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.idslogic.com\/blog\/wp-json\/wp\/v2\/media\/4233"}],"wp:attachment":[{"href":"https:\/\/www.idslogic.com\/blog\/wp-json\/wp\/v2\/media?parent=4232"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.idslogic.com\/blog\/wp-json\/wp\/v2\/categories?post=4232"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.idslogic.com\/blog\/wp-json\/wp\/v2\/tags?post=4232"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}