What would be faster - plugin, html or shortcode?

Question

I'm curious if anyone has experience with refining their WordPress site to make it as fast for page loading as possible and which approaches work better than others.

For example, lets take adding social media buttons to a footer. What would be fastest? What would be the biggest drag?

1. Plugin - there are some plugins, including for Genesis, that allow the user to enter a social media URL and then the icon and link are generate in a widget. I'm wondering if this would be a big load in case the CSS and files for all icons sets are loaded instead of just those being used, plus any additional plugin code being run.

2. HTML in a widget - With something this simple I thought that the code could be created and added to a text widget, with the images being stored in the theme folders. This can be a little risky because I've seen HTML code in a widget get blown out and clients can accidently edit the wrong piece.

3. HTML in the theme - I try to avoid hardcoding elements that the client might want to update, but this seems very efficient, unless it's in a widgetized area by default, in which case would you un-widgetize it?

4. Shortcode - with hardcoded elements that would need to be used in a couple of different places, I thought creating a shotcode could be a good option. But does anyone know if shortcodes tend to drag on a site? Do all of the elements within the shortcode file get loaded even if that shortcode is not called on that page? I'm trying to do away with unneeded CSS or scripts whenever necessary, but I don't know if shortcodes will only call the piece being called. Anyone know?

Thanks, any information or advice is greatly appreciated.

Answer 1

Personally I use a theme options page which echos out HTML if the admin fills out the information. It isn't the fastest but its great for management and simplicity.

Answer 2

Unfortunately, there's not a black-and-white answer here, because there's a variety of factors that come into play.

For example, server-side rendering of content is in many cases actually faster than rendering on the front-end, but that's largely dependent on the speed of your server. If you're on cheap, sharing hosting (like many of us are), server-side can be slower.

There are 7 things I recommend everyone do to improve site performance:

1. Concatenate. Combining like files together.
2. Minify. Removing the spacing, line breaks and comments from files.
3. Smush. Removing unneeded data from image files.
4. Icon Fonts. Icon fonts are a lighter, faster alternative to image-based icons.
5. Compress. Reduce file size by up to 70 percent.
6. Cache. Telling browsers to keep static assets stored locally so that they doesn’t have to be re-downloaded every time they visit your site.
7. Page Structure. Adjusting the location of CSS and JavaScript files for faster rendering.

If you'd like to learn more about any of these, I've written a pretty detailed article on faster WordPress sites. I've personally used these tips to create multiple sites that load in less than 2 seconds on cheap, shared hosting.

http://gomakethings.com/high-performance-websites/