How to Optimize the Speed of Odoo Speed Optimisation & Odoo Nowadays the number of eCommerce websites

Embed Size (px)

Text of How to Optimize the Speed of Odoo Speed Optimisation & Odoo Nowadays the number of eCommerce...

  • www.emiprotechnologies.com#OdooExperience2018

    How to Optimize the Speed of Odoo eCommerce/Website up to Maximum Level? Hiren Vora | Odoo eCommerce Consultant

  • Nothing is more frustrating than a slow Website. Slower

    websites always degrade the user experience!

  • ● Page Loading Time of your Odoo Website is

    probably the most important factor for Google when

    it comes to Search Engine Rankings!

    ● Since December 2017, the Google search engine

    has started ranking also based on mobile versions

    of pages, even for desktop searches. The goal of

    this decision is to protect users from the websites

    that have low performance and aren’t responsive to

    all devices.

  • A one-second delay in page load time yields

    ● 11% fewer page views

    ● 16% decrease in customer satisfaction

    ● 7% loss in conversions

    In fact, 47% of consumers expect websites to load in two seconds or less — & 40% will abandon a page that takes three or more seconds.

  • Slow speed = Kill conversions.

  • Speed Optimisation & Odoo

    Nowadays the number of eCommerce websites that are built with the Odoo

    Platform is ever on the rise. Speed factor of your website affects your traffic,

    page views, conversions, sales and thus your overall online reputation.

    If you are having your Website built in Odoo, How can you make it faster?

  • Let’s see...

  • Choose Your Web Server Carefully

    Use NGINX as an Web Server for your Odoo Website!

    ● Designed for High Concurrency

    ● Load Balancing

    ● Zero downtime

    ● GZIP compression

    ● Serve static content much faster than Apache

    ● Caching

    ● Reverse Proxy

  • Always Prefer NGINX over Apache

    Apache is like Microsoft Word, it has a million options but

    you only need 10. Nginx does those 10 things, and it does

    8 of them 50 times faster than Apache.

  • Nginx Web Server Set Up for Odoo Website

    ● Compress data(Gzip)

    ● Keep-alive

    ● Load Balancing

    ● Enable cache for static files

    ● Add Expires Headers

  • Compress Data (Gzip)

  • Keep-alive in NGINX

    HTTP keep-alive is an instruction that allows a single TCP connection to

    remain open for multiple HTTP requests/responses. By default, HTTP

    connections close after each request. When someone visits your site, their

    browser needs to create new connections to request each of the files that

    make up your web pages (e.g. images, Javascript, and CSS stylesheets), a

    process that can lead to high page load times.

  • Load Balancing in NGINX

    Use NGINX as a very efficient HTTP load balancer to distribute your Odoo

    Website's traffic to several application servers for improving performance,

    scalability, and reliability of your Odoo Website & eCommerce with NGINX.

  • Load Balancing in NGINX

  • Enable Cache for Static Files in NGINX

    When caching is enabled, NGINX saves responses in a disk cache and

    uses them to respond to clients without having to proxy requests to Odoo

    Application Server for the same content every time.

  • Enable Expires Headers Setting in NGINX

    Expires headers tell the browser whether they should request a specific file

    from your Odoo server or whether they should grab it from the browser’s

    own cache.The whole idea behind Expires Headers is to reduce the

    number of times a file is downloaded from a server and allow the browser

    to utilize a previous version of a file that is already saved on your machine.

    Doing this reduces the number of HTTP requests for the server.

  • Reduce Page render time Qweb → Html

    Direct load the static html without let Odoo rendering your Qweb template to

    Html. This technique will work only for the Static Pages of your Website.

  • Lazy Load the Images in your Static Pages

  • Implement Image Sprites in CSS

    Rather than include each image as a separate image file, it is much more

    memory- & bandwidth-friendly to send them as a single image, so the

    number of HTTP requests is reduced.

    Ref : https://www.emiprotechnologies.com/magento/online-jewellery-store

    https://www.emiprotechnologies.com/magento/online-jewellery-store

  • Move Scripts to the Bottom!

    ● Load External JS files at the end of the Page.

    Web pages will be displayed to users first, then load javascript, the pages render

    much faster. But it depends on your application, not all the javascripts can be put

    at the bottom, be careful!

    ● Always Load your all Internal as well as third party JS files

    asynchronously by Defer Attribute

  • Asynchronous Image Loading with JS

    This is a technique developed by Emipro in Odoo to smartly display

    the small size of images of your Website first while the original

    image is being lazy loaded until entire page loading is not

    completed.

    When entire page load finishes, do a soft transition in the

    placeholder to the original Image. You will feel like the blurry images

    being changed by their respective originals.

  • Asynchronous Image Loading with JS

    This technique is very effective to speed up Category Page in Odoo

    eCommerce.

    We have seen unbelievable result in Speed

    Improvisation through this solution!

  • Reduce the number of Third Party Plugins

    ● The more plugins are installed, the more resources are needed

    to run them.

    ● Not only does the website speed depend on the number of

    installed plugins but also on their quality.

    ● Try to avoid plugins that load a lot of scripts and styles .

    ● The best solution is to keep only the necessary ones and ensure

    that they are kept up to date.

  • Use Content Delivery Network for High Traffic

    CDN is a collection of web servers distributed across multiple locations so

    content can be more efficiently delivered to users. CDNs are typically used

    for static content or files that do need to be touched once uploaded.

    ● Amazon CloudFront

    ● Cloudflare

    ● Keycdn

    ● CDN77

    https://aws.amazon.com/cloudfront/?sc_channel=PS&sc_campaign=acquisition_IN&sc_publisher=google&sc_medium=cloudfront_nb&sc_content=cdn_companies_e&sc_detail=cdn%20providers&sc_category=cloudfront&sc_segment=111916800061&sc_matchtype=e&sc_country=IN&s_kwcid=AL!4422!3!111916800061!e!!g!!cdn%20providers&ef_id=WdtSRwAAAF3QDRyY:20180927111957:s https://www.cloudflare.com/ https://www.keycdn.com/ https://www.cdn77.com/

  • What is CDN?

  • CDN Selection

    Make sure that while choosing the right CDN Provider for your Odoo

    Website, it has server available in your region too! For example, in

    your website, do you have a large customer base / high traffic

    coming from China? Then a CDN provider should have their server

    options inside some China – specific regions.

  • General Instructions for Speed Up Website

    ● Always show Images the resolution that exact

    fits into your Webpage’s Division Size

    For example, your Division’s size is 500 * 500 and you are using

    image of 2000 * 2000 resolution into it.

  • General Instructions for Speed Up Website

    ● Use conditional statements to only load what's needed

    If you find that you only need to load certain images on Desktop

    or need to run a specific script on Mobile only, using conditional

    statements to load them can be a great way to increase speed.

    This way, you aren’t forcing the browser to load a variety of

    scripts or images that won’t be useful for certain devices or

    viewports

  • General Instructions for Speed Up Website

    ● Don’t load extra/unnecessary fonts in your Webpage.

  • General Instructions for Speed Up Website

    ● Don’t load the images in base64 data format at your Webpage.

    If you do the base64 encoding from the source files with each

    request, you'll be using up more CPU, thrashing your data

    caches, etc, which might hurt your servers response time.

  • General Instructions for Speed Up Website

    ● Don’t load the images in base64 data format at your Webpage.

    Overall page size will be increased so your request's TTFB time

    will be increased too.

    The browser can't store that kind of images in the cache. So

    every time when the request will be sent from your browser,

    server will take the extra load.

  • General Instructions for Speed Up Website

    ● Uninstall web modules from Odoo Instance which are not in use for the time being.

    For example, you are not going to use the blog app at your

    website for time being so you are just hiding the menu of Blog

    from the header in your website. It means