Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Performance 101

Performance 101

Performance is a popular buzzword in the WordPress space. For most users, installing a performance optimization plugin is the one thing they do on their website, maybe configuring some of the settings. But performance is way more than that. In this session, I want to give a quick overview of what is important for a website to be considered performant and what to look at when working with WordPress websites.

Jessica Lyschik

September 16, 2022
Tweet

More Decks by Jessica Lyschik

Other Decks in Programming

Transcript

  1. Performance 101
    Jessica Lyschik
    WordCamp Netherlands 2022

    View full-size slide

  2. Agenda
    • What is performance?
    • Which performance tools are available?
    • What influences the performance of a
    WordPress website?

    View full-size slide

  3. What is performance?
    Besides it's a fancy buzzword

    View full-size slide

  4. Performance is
    not a setting.
    Not in WordPress, not in your hosting and it's not a (caching) plugin.

    View full-size slide

  5. Performance is the
    continuous
    optimization of all
    components.
    Really everything: Hosting, WordPress, Plugins, Themes, Content.

    View full-size slide

  6. What performance tools are
    available?
    How to measure the performance of your site

    View full-size slide

  7. PageSpeed
    Insights
    By Google. Shows a calculated
    score in either green (good),
    orange (average) or red (bad).
    Different scores for mobile and
    desktop. Gives suggestions
    what can be improved.

    View full-size slide

  8. WebPage
    Test
    Very detailed results with lots
    of tables and charts. Made for
    users with higher technical
    interest. Suggestions in the
    new "Opportunities &
    Experiments" tab.

    View full-size slide

  9. GTmetrix
    Kind of in between
    Pagespeed Insights and
    WebPageTest. To change the
    test server location from
    Vancouver, Canada to
    something else, you need a
    free account.

    View full-size slide

  10. Browser
    DevTools
    Chrome and Firefox also offer
    some interesting insights in
    their dev tools, in "Network"
    or "Network Analysis".

    View full-size slide

  11. What influences the performance of
    a WordPress website?
    Caching is not everything

    View full-size slide

  12. Hosting
    • Your hosting package needs to fit your website
    • Don't go for the cheapest, if your website needs
    WooCommerce for example
    • If your website grows over time, don't forget to upgrade your
    hosting too

    View full-size slide

  13. WordPress
    • If possible, have the latest WordPress version running
    • At least, have it updated to the last security update
    • On production sites: disable WP_DEBUG

    View full-size slide

  14. Themes
    • "Multi Purpose Themes" often come with lots of assets
    • Choose specialised or performance optimized themes
    • Research for ratings or recommendations
    • Brand-new but worth a look: Block Themes together with Full
    Site Editing

    View full-size slide

  15. Plugins
    • In general: as many as neccessary, as few as possible
    • Don't rely on the "not more than X plugins" myth
    • It's about the quality of a plugin and the functional range
    • Have a first look at the WordPress Plugin Repository
    • Paid plugins: check out ratings, recommendations or if a free,
    limited plugin is available

    View full-size slide

  16. External resources
    • The less, the better!
    • Every request to another server increases the time needed to
    load your site.
    • Google Fonts, Google Maps, Ads, Instagram Embeds,
    YouTube Embeds...

    View full-size slide

  17. Images
    • Edit images before upload: as small as possible, as large as needed
    • Further image optimization can be handled through plugins in
    WordPress like ShortPixel, Smush, Imagify…
    • Choose the right image size when adding your image to your
    content

    View full-size slide

  18. Contents
    • Your home page shouldn't have too much content
    • Create subpages for heavier use-cases like galleries
    • Avoid using sliders or any additional animations, or use
    modern and optimized methods
    • Avoid autoplay of audio or video files

    View full-size slide

  19. There are many things you can do to
    optimize your website for performance
    besides using a Caching plugin.
    Don't try to get the very best scores in tests, it
    could also hurt your site.
    Every website is different and getting a
    specific average score doesn't make it an
    unsuccessful website.
    Tips

    View full-size slide

  20. Thank you!
    Jessica Lyschik
    Frontend & WordPress Developer, Extendify Inc.
    @jessicalyschik
    https://jessicalyschik.com
    What is your
    question?

    View full-size slide