Making code ugly is no fun to read nor maintain. I seen quite a bit of web page scripting code in PHP the last few years. One example that I see over and over again that is just terrible, involves generating HTML markup on the fly based on boolean conditions. Here we look at two common methods and another that is a bit more readable.
We all know that keeping logic separate from presentation is a good thing. Templating systems exist to keep things in their own boxes. A good example of this is in the article I wrote entitled Roll Your Own PHP Templating Engine where designers go out and create the markup while web developers create the code.
Variable stubs are inserted into the template with simple echo statements and nothing more than that. Code modules are instantiate classes that generate variable values and passed onto a template engine to bind variable to the "stub".
But sometimes, this method won't work especially when one has to create them on the fly. There are times where you have to generate the markup as you go, especially if you are a Drupal or Wordpress Template Developer.
There are, however, some readability problems that arise when looking at the code. Two common methods are used to generate markup on the fly used in practice. I present here another method that I believe is easier to read and maintain.
This one starts out looking ugly from the start and gets even more uglier as the page generation gets longer and longer. Lining up brackets is a nightmare and errors creep in due to syntax mistakes. When you read code like this, you drown in markup and code. I generally cringe when I see code like this.
<?php
$bTest = true;
if (!$bTest) {
?>
<div id="content">
<?php
}
<?php if (!$bTest) {
?>
</div>
<?php
}
?>This method involves generating output via echo or output of the XHTML markup as the algorithm progresses. It is cleaner to read, takes up way less lines of code.
<?php
$bTest = true;
if (!$bTest)
echo "<div id='content'>";
if (!$bTest)
echo "</div>";
?>This one is way more easier to read although it comes with an additional function call. This involves just two lines of code. And, the extra benefit of just generating output and testing a conditional before rendering output.
Also, notice a subtle but nice "feature". The markup, when used as the first parameter, neatly "lines up" making it easier to read.
<?php
function out($str, $condition=true) {
if ($condition)
echo $str;
}
out("<div id='content'>"); // just output markup
out("</div>");
out("<div id='content'>", $bTest); // conditional output
out("</div>'', $bTest);
?>Which do you prefer to read?
Frankly I like my last method because it lines up the tags. It allows me to keep things "prettier" and clearly see the levels of nesting better.
