Wednesday, May 31, 2017

Are Your WordPress Themes Flexible or Fast?

Are Your WordPress Themes Flexible or Fast?

This article is part of a series created in partnership with SiteGround. Thank you for supporting the partners who make SitePoint possible.

If you've developed WordPress themes for mass distribution, you might have come across the problem of finding the perfect balance between building performant themes and building feature-rich, media-heavy products for your customers.

Let's look closer into what the tension might be all about and how you can find ways to compromise between creating fast loading themes and giving users the flexibility and easy customization options they love and expect.

Are Flexibility and Performance At Odds When Coding WordPress Themes?

I will start by saying that my discussion is not going to be about performance in relation to an entire WordPress website, which might include a number of different factors like finding a great hosting provider, implementing caching mechanisms, leveraging both back-end and front-end techniques, etc.

Also, the topic is not about the performance of WordPress themes you code from scratch either for your own use or for a specific client. In these particular cases you tailor your themes to the specific needs of yourself or your individual client, which should make performance optimizations easy to accommodate.

Rather, my focus will be on WordPress themes you code for the general public, to be distributed on WordPress.org or an online marketplace. The scenario is one where you, as the theme developer, have no control over how your theme is going to be used and customized.

But why coding for performance could clash with coding themes for the public?

On the whole, performance requires you:

  • To stick to simple designs

  • To include a limited number of features into your themes (more features are likely to require more processing power and resources, all of which impacts on theme performance)

  • To add the minimum number of page templates for a theme to function (fewer templates require fewer resources, which is good for performance)

  • To perform as few database queries as possible (querying the database takes time)

  • To limit the number and size of images and other media, which are notoriously heavy files

  • To minimize the number of HTTP requests (each round trip to the server and back takes some time with obvious negative consequences on performance).

On the other hand, a considerable number of your themes users are likely more entrepreneurial than tech minded. Therefore, what they might be looking for is a product they can turn into pretty much anything without so much as one line of code, with lots of functionality out of the box, breathtaking photo and video assets, super delightful parallax and other animation effects, and such like.

To give theme users all the flexibility they would like could come with some performance costs. But, let's go into a few specific points that illustrate how this can happen and how you can find some middle ground for a successful outcome.

Themes Are for Appearance, Plugins for Functionality

Although a number of reputable WordPress experts have been throwing some well argued criticisms against the so called kitchen sink themes, that is, those multipurpose themes that can become anything to anybody by offering any functionality under the sun, the demand for them is still going strong.

Themes that give users the ability to easily add social media buttons, SEO features, contact forms, price tables, etc., while attracting a lot of attention from buyers, don't come without some serious drawbacks.

In particular, this kind of WordPress theme comes tightly coupled with plugins specifically built for it, or even integrated directly into the theme. This practice is widely frowned upon for the following reasons:

  • Some of the plugins that come bundled with a theme can have vulnerabilities that put theme users at risk. If the theme doesn't come with specific plugins installed it's less open to such risks

  • A super important drawback of tight integration between themes and plugins is what Ren Ventura identifies as theme lock. Here's his explanation of this problem:

    Theme lock occurs when a WordPress user cannot change his or her theme without gutting most of the site’s functionality. Once the theme is deactivated, it deactivates things like shortcodes and custom post types that were registered by the theme. Without these features that the user has heavily incorporated into the site, things fall apart.

    As a consequence, when you change theme, a lot of the stuff you thought it was part of your website content disappears with the old theme. For instance, if your theme offered the ability to add testimonials to your website, once you change theme all the content related to your testimonials will be gone. Not nice.

  • And of course, bloat and hence performace costs. Let's say you don't need a testimonials section on your website. Yet, all the code that makes that functionality work in the theme is still there: it takes up space on your server, which ultimately costs money.

A great maxim the Theme Review Team (i.e., the volunteers who review themes submitted on the WordPress.org themes repo) rightly enforces is: keep functionality separate from appearance. Plugins deal with functionality, themes with appearance. Getting rid of all the complication will improve theme performance and at the same time make it easier for users to install and configure WordPress themes.

Your Users Don't Need Tons of Theme Options (But They Might Not Know This)

Until not long ago, WordPress themes included rather complicated theme option pages to enable users to make all sorts of modifications with a button click.

These days, thanks to a momentous decision taken by the Theme Review Team on WordPress.org in 2015, most themes offer theme options using the WordPress Customizer, which makes possible live previewing the changes as they're being made by users.

Unfortunately, the kitchen sink mentality that ruled the old theme option pages has started to migrate to the Customizer, which you can now see as also starting to get filled up with all sorts of settings.

Although non technical customers love theme options to make changes to their themes, sometimes too many options available bring more problems than they seemingly solve:

  • Too many options can paralyze users who are not too familiar with core principles of website design

  • It can take more time than expected to set up and configure a theme

  • It's easy to make mistakes like choosing the wrong colors, making text unreadable, etc.

  • Users might add too many fonts to their themes, thereby spoiling the design and slowing down the website

  • More options means adding more functionality to the theme, thereby impacting on its performance.

Although your customers might not accept this at first, you are the theme designer, therefore you should be the one who is best placed to make the important design decisions for your theme.

A well-calibrated number of theme options should be sufficient to let your customers make some targeted and carefully predefined (by you) modifications to personalize the theme and make it their own.

Implement Smart Graphics Optimization Techniques

Images are likely to put the heaviest weight on theme performance compared to template files, scripts and styles. Just run any theme through the Pingdom's Speed Test tool to verify this.

However, a generous use of full-screen, bold images is hardly surprising. Images add huge aesthetic value to themes and customers are drawn to a theme largely on the basis of its visual impact.

Continue reading %Are Your WordPress Themes Flexible or Fast?%


by Maria Antonietta Perna via SitePoint

No comments:

Post a Comment