PHP: Creating Dynamic Web Pages with the Composite View Design Pattern

Sharing nearly the same logic as its counterpart Composite (at least at a basic level), Composite View is a clever design pattern that takes full advantage of the functionality provided by Composition to manipulate single and multiple elements of a user interface through the same set of methods. While the pattern does work well in a great variety of languages and applications, where it really shines is in the generation of dynamic web pages, especially when implemented within an existing MVC layer, which is very popular these days.

Even though the theoretical concepts that surround the use of Composite View aren’t as easy to follow as the ones that belong to other patterns, the truth is that implementing it with PHP is a fairly straightforward process that can be tackled with only minor hassles. To demonstrate that my claim is true, in previous parts of this series I created a simple hierarchy of composite view classes, comprised first of an abstract parent which defined the structure and behavior of generic view objects, and then of two concrete subclasses for handling multiple and single objects.

Describing the tasks that each of these classes perform is rather pointless; it’s necessary to show how functional they actually are when used in a concrete case. In consonance with this idea, in this penultimate installment of the series I’m going to illustrate how to use the classes for rendering different sections of a basic web page with a single method call. In doing so, you’ll be able to see how powerful the Composite View pattern can be, particularly when it comes to manipulating (X)HTML documents in a truly flexible fashion.

Are you ready to see the set of sample classes developed previously in action? Then keep reading!

Lazy-loading the previous classes: building a basic autoloader

Since my objective here is to demonstrate how to display different sections of a web page by calling only the “render()” method defined by the composite view classes developed in previous tutorials, the first thing that I’m going to do is create a basic autoloader. The autoloader will lazy-load the classes without having to use multiple PHP includes.

Having explained that, here’s the definition of the autoloader. It looks like this:

(Autoloader.php)

<?php

class Autoloader
{
    private static $_instance;
   
    // get the Singleton instance of the autoloader
    public static function getInstance()
    {
       if (!self::$_instance) {
           self::$_instance = new self;
       }
       return self::$_instance;
    }
   
    // private constructor
    private function __construct()
    {
        spl_autoload_register(array($this, 'load')); 
    }
   
    // prevent cloning instance of the autoloader
    private function __clone(){}
    
    // autoload classes on demand
    public static function load($class)
    {
        $file = $class . '.php';
        if (!file_exists($file)) {
            throw new ClassNotFoundException('The file ' . $file . ' containing the requested class ' . $class . ' was not found.');
        }
        include $file;
        unset($file);
        if (!class_exists($class, FALSE)) {
            throw new ClassNotFoundException('The requested class ' . $class . ' was not found.');
        }
    }  
}// End Autoloader class

<?php

class ClassNotFoundException extends Exception{}

As you can see, the underlying logic of above “Autoloader” class is very simple to grasp. It uses the SPL stack to include a specified class on demand via its static “load()” method. In this case, I decided to implement the autoloader as a Singleton, but naturally this process is entirely optional; it can be tweaked to suit more specific needs.

So far, so good. Now that the previous autoloader is up and running, it’s time to start creating the scenario required to put the previous classes to work together. Given that, in the following segment I’m going to define two basic sections of a fictional web page, together with a master layout. They'll be rendered on screen by calling a single rendering method.

To see how the web page sections and the corresponding layout will be defined, click on the link that appears below and keep reading.