How to handle WooCommerce with 10k+ products

Talk at WordCamp Vienna 2024 about data synchronization and frontend perfomance in WooCommerce

Transcript

1. Matthias Wagner | FALKEmedia WordCamp Vienna 2024 How to handle WooCommerce with 10k+ products Photo by Ruchindra Gunasekara on Unsplash
2. 4 Blocks Introduction 2 01 Frontend performance 03 Data sync 02 Q&A 04 Photo by JESHOOTS.COM on Unsplash
3. Your experience? Tried Already worked with WooCommerce at least once Sold Already worked with shops that sold to real people For Clients It was a project for a client of you or the agency you worked For Self It was for yourself or a company you were employed 3 Photo by Fikret tozak on Unsplash
4. Our experience at FALKEmedia ~ 18 People Working on our clients‘ success Full service Marketing agency with not only web in mind WordPress 10 years + experience, hundreds of websites WooCommerce For clients and also for our own projects 4 Photo by Fikret tozak on Unsplash Photos by FALKEmedia GmbH
5. WooCommerce Only good enough for small shops? https://supporthost.com/woocommerce-slow/ 5 Photo by Rubaitul Azad on Unsplash
6. Learnings From one of our latest projects 6
7. Data sync (old fashioned way) ERP Local server with products database Fetch data Local machine gets XML from ERP daily and pushes to web Webserver Script reads all new XML files, processes, imports to WooCommerce Time sensitive Everything is timed precisely, from local export to server cronjobs 7
8. Timing Local / Client-side (automated) • 8 pm: Export today‘s changes from ERP • 10 pm: Start to transmit XML to web server Webserver / 5-min cronjob • 12 am: Start to check for complete delivery and run import • 5 am: Status-check and maybe status-mail Delete various frontend caches Start cache pre-generation (ongoing) Cronjob should be executed exclusively (Hosting setting) 8 Photo by Andrik Langfield on Unsplash
9. How we import into Woo • Not via REST API (was slow in our tests) • Custom PHP script with WordPress environment loaded (much faster) • WC CLI would probably be even better • Any experiences? 9 Photo by Andrik Langfield on Unsplash Photo by AbsolutVision on Unsplash
10. Code examples 10 Include WordPress environment in your custom script. Please use Google or ChatGPT to find out more details on functions used.
11. Code examples 11 Speed up script by disabling unwanted plugins. With this „must use“-plugin installed: Please use Google or ChatGPT to find out more details on functions used.
12. Code examples 12 Generate directory hash, which can be used to check if contents have changed. Please use Google or ChatGPT to find out more details on functions used.
13. Code examples 13 Fast handling of XML files in PHP: Combine XMLReader and SimpleXMLElement Please use Google or ChatGPT to find out more details on functions used. https://drib.tech/programming/parse-large-xml-files-php
14. Code examples 14 Finally create products, categories etc. in WooCommerce. Please use Google or ChatGPT to find out more details on functions used. Stick to the WooCommerce functions and avoid wp_insert_post for example. (Product type would be missing and product not found in certain queries) https://woocommerce.github.io/code-reference/
15. Watch out • Never rely on complete and intact data (FTP provides so much possible failures) • Check if transmission is really done (Directory Checksum) • Lock directory while reading (Right management or simply rename via script) • Error handling (File size, corrupt XML, …) • Everything done right from client side? (Categories missing, too big binaries, …) • Archive transmissions from past 30 days (Debugging) 15 Photo by Andrik Langfield on Unsplash Photo by AbsolutVision on Unsplash
16. Status reports • Report only if errors or warnings occured • Have status available, if client calls ;) • Have even more detailed logs available (Debugging) • We are very happy with a status-table in our WordPress DB • Give the client a status-page in addition to emails, which reads out status-table 16 Photo by Andrik Langfield on Unsplash Photo by Solen Feyissa on Unsplash
17. Code examples 17 Simple PHP Logger Please use Google or ChatGPT to find out more details on functions used. https://github.com/advename/Simple-PHP-Logger
18. Code examples 18 Simple status table in MySQL (quick & dirty) Please use Google or ChatGPT to find out more details on functions used.
19. Code examples 19 Detailed information on activities for the client, so they can first check if anything was wrong with their data before calling you that a product is not listed ;) Please use Google or ChatGPT to find out more details on functions used.
20. Recap • Do not rely on anyone or anything when it comes to continuous data synchronization 20 Photo by Luis Villasmil on Unsplash
21. 21 Frontend Performance
22. Plugin recommendations WP Fastest Cache • One out of many great caching plugins • Simple & fast setup • Priority cache preload via XML sitemap • https://de-at.wordpress.org/plugins/wp- fastest-cache/ • https://www.wpfastestcache.com/ Offers lifetime licenses (no affiliate) 22 Photo by Marc-Olivier Jodoin on Unsplash
23. Cache priority • We aim to deliver each page as cached result, so that nobody has to wait • Usually either first visit triggers cache or it is created in some fixed order • Create a hit-table in your database, so you can query most visited pages from last 30 days • Put these in a xml sitemap and use WP Fastest Caches sitemap functionality (https://www.wpfastestcache.com/features/prel oad-settings/) • Share your feedback and ideas with developers 23
24. Plugin recommendations FiboSearch • AJAX search. Indexed for massive speed • Simple templates, great to customize • Define, which meta keys to search • https://de-at.wordpress.org/plugins/ajax- search-for-woocommerce/ • https://fibosearch.com/ Offers lifetime licenses (no affiliate) 24 Photo by fibosearch.com
25. Caching of AJAX calls • We use ajax calls for our product overview pages and in single pages • Add prices after pageload, only if user is logged in • Infinite scrolling for categories and sub- categories • Better performance for initial pageload on categories with lots of products – only empty divs with category id as attribute present • Not possible with plugins we know, so we use a simple disk cache for it 25 Photo by Xu Haiwei on Unsplash
26. Code examples 26 Cached AJAX result (cache directory is wiped every day) Please use Google or ChatGPT to find out more details on functions used.
27. You already know that • Use a dedicated server for heavy load projects • Use well scaled images in webp format • Use lazy loading for images • Do not use bloated themes • Do not use plugins with much overhead • … • Generate local lighthouse reports from your incognito browser for real insights 27 Photo by Surface on Unsplash
28. Recap • Great performance is possible with WooCommerce, also for huge amounts of products and categories 28 Photo by Surface on Unsplash
29. REACH FOR THE STARS Photo by SpaceX on Unsplash falkemedia.at speakerdeck.com/mwy linkedin.com/in/matthiaswagnerwy