Ricardo Correia

Category: WordPress Development

  • When WordPress caching system makes things slower

    When WordPress caching system makes things slower

    Last week has launch time for my/Samsys latest and last plugin, an internal messaging system for WordPress websites, developed to work together a custom WordPress product for Pre-schools.

    The plugin allows registered users to exchange messages between them using a front-end interface ( non-admin users) and a back-end interface on the wp-admin (users with administrative access).

    Everything was going smoothly until I started testing on a live website with more than 600 registered users. The front-end ran smoothly but the back-end became painfully slow with over 15 seconds of load time.

    After some investigation, I was able to pinpoint the “problem”, multiple databases calls for “update_meta_cache” each call only took milliseconds to process but there were thousands of them and it was slowing down the back-end performance.

    What’s “update_meta_cache” ?

    As it’s name suggests, this functions updates metadata cache on a specified object and runs  everytime you fetch metada from the database.

    “update_meta_cache” is very handy on the front-end where exists a caching mechanism in place but in the back-end, no cache is active and it slowed down the plugin performance painfully. The solution has relatively simple, instead of fetching the users every time I needed them listed I created an object with all the needed user data, saved it using Transients API, and every time a new user it’s added to the website the object it’s re-created with the new data.

     

  • How to install a php linter (WordPress standards) in Windows 10 and Sublime Text 3

    How to install a php linter (WordPress standards) in Windows 10 and Sublime Text 3

    For some time now, I’ve been thinking that I needed to get a php linter in my workflow.

    This little addition will decrease debugging time, letting me know instantly if there’s some kind of syntax mistake, and also with WordPress standards active will instruct me to follow all the coding standards.

    After a little chat with some friends yesterday night and seeing once again linting in action, I said to myself “Today I’ll get this thing working on Windows”.

    After some experiments and reading I’ve encountered the easiest and safest way to do this install, and finally get linting working on my setup (Windows + Sublime Text 3) these are the steps:

    Install PHP

    • Download the binaries from http://windows.php.net/download/ (I’ve selected the VC11 x86 Non Thread Safe version for my setup.)
    • Unzip the downloaded folder to c:\php
    • Activate some basic php modules:
      • Copy php.ini-production to php.ini
      • Uncomment the following lines:
        • extension_dir = “ext”
        • extension=php_bz2.dll
        • extension=php_curl.dll
        • extension=php_fileinfo.dll
        • extension=php_gd2.dll
        • extension=php_intl.dll
        • extension=php_mbstring.dll
        • extension=php_exif.dll
        • extension=php_openssl.dll
        • extension=php_pdo_mysql.dll
        • extension=php_pdo_sqlite.dll

    Install Composer

    Install PHP Code Sniffer using Composer

    • On your bash console run the following comand:
    • composer global require "squizlabs/php_codesniffer=*"

    Install WordPress PHPCS standards

    • On console discover the path to the linter executable
    • which phpcs
    • Go to the PHPCS directory, it should be something like: C:\Users\{your-user}\AppData\Roaming\Composer\vendor\bin\
    • Clone WordPress standards
    • git clone -b master https://github.com/WordPress-Coding-Standards/WordPress-Coding-Standards.git wpcs

    • Add WordPress to PHPCS configuration

    • phpcs --config-set installed_paths /c/Users/{your-user}/AppData/Roaming/Composer/vendor/bin/wpcs
    • Set the default Standard as WordPress
    • phpcs --config-set default_standard WordPress

    Install Linter on Sublime Text 3

    The last steps are installing the linter packages on Sublime Text 3, for this open your Package Control and install the following packages:

    1. SublimeLinter
    2. SublimeLinter-phpcs

    Next, you’ll need to restart sublime and setup the linter configuration, it’s fairly simple, just copy the file in “Preferences/Package Settings/SublimeLinter/Settings – Default” to “Preferences/Package Settings/SublimeLinter/Settings – User” and edit the phpcs linter configuration setting the standard as WordPress:

    "phpcs": {
    "standard": "WordPress"
 },
  • Check for duplicated post meta values

    Check for duplicated post meta values

    Some background

    For a couple of months, I’m using WordPress as an application framework and this requires some additional validations on post meta fields, one of those validations is the need to have unique meta values, for some post types. For instance a phone number on a “client record” each client has one number and if you’re inserting a new client with the same number, something went wrong and you need to review that record.

    To allow this validation, I’ve used the “publish_post” hook and checked for the field value in the posts from that post type.

    If the value already exists in other post meta, the post is set to “Draft” and the user informed of the duplicated value in order to correct it.

    Check for duplicated post_meta values

    add_action('publish_{your_post_type}','rfvc_check_duplicate_{your_post_type}', 10, 2);

function rfvc_check_duplicate_{your_post_type}( $post_id, $post ){
        
        global $wpdb;
        $meta_key = {your_meta_key}

        //Check if publishing {your_post_type} and not auto saving 
	if( get_post_type( $post_id ) != {post_type} ) return;
	if ( defined('DOING_AUTOSAVE') && DOING_AUTOSAVE ) return;

	//Get unique meta value if meta_value already defined
	$unique_meta = get_post_meta( $post_id, $meta_key , true );
        
        //Get unique meta value if new
	if( isset($_POST) && $unique_meta != $_POST[$meta_key] ){
		$unique_meta = $_POST[$meta_key];
        }

        $duplicated_entries = $wpdb->get_results( "SELECT post_id FROM $wpdb->postmeta WHERE meta_key LIKE {$meta_key} AND meta_value = {$unique_meta} " );
        
        if( 0 != count($duplicated_entries) && $post_id != $duplicated_entries[0]->post_id ){

		//Add Error Message
		add_settings_error(
		    'duplicated-meta',
		    'duplicated-meta',
		    __('
<style>#message{ display: none; }</style>

Duplicated Field. <strong>Post saved as Draft</strong>.','rfvc'),
		    'error'
		);
		    
		set_transient( 'settings_errors', get_settings_errors(), 30 );

		$post_data = array(
			'ID'           => $post_id,
			'post_status' => 'draft'
		);
		wp_update_post( $post_data );

	}

       return;

}

  • Creating a web and WordPress development environment

    Installing Ubuntu Server Virtual Machine, using VMware (Part 2)

    After installing Ubuntu Server, using VMWare as explained in my previous post, You’ll have a local development environment for your projects that’s fully functional, but only with  the basic features.

    You’ll want to use a series of tools in your development stack, that aren’t available from start in the installation and also, have the means to easily edit the files inside your server, preferably without the need to use FTP or other tools, after all, this is your local stack.

    In this post I’ll explain how I’ve configured the server to improve the development environment and run the following tools correctly,

    • Samba ( File sharing between the virtual machine and our local system)
    • Git
    • Ruby and Gem
    • SASS
    • Bourbon
    • node.js
    • Grunt
    • Wordmove

    1. Install and configure Samba on Ubuntu VM

    First step, the obvious, install Samba using root access

    sudo apt-get install samba

    Next you’ll need to open your Samba configuration file ( /etc/samba/smb.conf ) and add a few lines in order to configure a shared folder, start by opening your configuration file with your favorite editor and then you’ll need to add the following lines to your file:

    # The following property ensures that existing files do not have their permissions
# reset to the "create mask" (defined below) if they are changed
 map archive = no

# Notify upon file changes so that Windows can detect such changes
 change notify = yes

[htdocs]
 comment = Htdocs Files
 path = /opt/lampp/htdocs/
 guest ok = no
 browseable = yes
 writable = yes
 create mask = 0664
 directory mask = 0775

    In the above, I’m assuming you want to share the htdocs folder from your lampp install.

    Next, you need to add a Samba user, with the same name and password as your Ubuntu user account

    
sudo smbpasswd *username*

    To finish this step you need to restart the samba service,

    
sudo service smbd restart

    2. Setting permissions on htdocs folder

    In order to be able to edit, add and delete files from the htdocs folder you’ll need to set all the permissions correctly on that folder, to do this you’ll need to change the folder permissions, doing the following:

    First you need to create a new group “www” which will have the permissions for this folder,

    sudo groupadd www

    Next, you’ll change the group on the directory,

    sudo chgrp -R www /opt/lampp/htdocs

    and then you need to set the correct permissions on that directory:

    sudo chmod 2775 /opt/lampp/htdocs

    To finalize, add your user to this group, running the following command:

    sudo usermod -aG www *username*

    Now you’ll need to logout or restart your server, in order to these changes take effect, as these rules are read at login time.

    3. Configure static IP in your VM and change your windows “hosts” file

    For me this is one of the most important steps on this configuration, I love being able to type something like local.dev in my browser, putty or ftp and be able to access my VM without any hassle.

    To do this you need to change two files in your VM.

    First, open the “interfaces” file ( etc/network/interfaces ) in your favorite editor, and change the following lines:

    auto eth0
iface eth0 inet static
address 192.168.0.100
netmask 255.255.255.0
network 192.168.0.0
gateway 192.168.0.2
broadcast 192.168.0.255

    You’ll need to get the correct values for each from your own network configuration, just have in mind that the ip address need to be unique and in the same network as your local machine.

    Next, open the “resolve” configuration file ( etc/resolv.conf ) and change the nameserver to match your gateway ip address.

    Then just restart the network, by running the following command:

    sudo etc/init.d/networking restart

    Back in windows you need to add a new entry to your host file, for that you need to open notepad or your favorite text editor, as administrator, then navigate to the host file, usually in: C:\Windows\System32\drivers\etc and add the following line to your file:

    192.168.1.100 local.dev

    The first part is your virtual machine ip address, the second your desired alias for it.

    4. Install all the packages you want

    Now it’s time to install all the packages you want in your VM, before selecting them and start installing, just run an update to make sure you’re getting the latest stable versions.

    sudo apt-get update

    Now it’s time for installing the packages, usually I install the following:

    • Git
    • Ruby
    • Gem
    • Sass
    • Bourbon
    • Wordmove
    • lftp
    • mysqldump
    • grunt
    • Node.js

    Please have in mind that these are the steps I use to create a local VM for development, these configurations shouldn’t be used on a VPS or a production environment.

    There are other alternative configurations for a local environment including the famous VVV, https://github.com/Varying-Vagrant-Vagrants/VVV . The last time I tried to install this on my windows laptop I couldn’t get it to work correctly due to some windows permissions, I’ll give it another try some time soon, but for now I’m sticking with my own VM.