Is Your Site This Dynamic?

Share this article

From the immensely entertaining The Daily WTF, a daily digest of horribly bad code spotted in the wild, comes this cautionary tale of dynamic web development gone awry.

Developer Stephan Jennewein was hired to update a web site for Firefox compatibility. What at first glance appeared to be a modest web site made up of 15-20 static pages turned out to be an intricate mixture of JavaScript and PHP code. Every one of the apparently static pages contained code resembling this:

<html>
  <head>
    <link href="dynsitebase/styles.php" rel="stylesheet" type="text/css" />
    <script src="dynsitebase/base.php" language="JavaScript"></script>
    <script src="dynsitebase/themes.php" language="JavaScript"></script>
    <script src="dynsitebase/sitedata.php" language="JavaScript"></script>
    <script src="dynsitebase/pagelayout.php" language="JavaScript"></script>
    <script language="JavaScript">
      document.write("<title>" + CurrentPage.Title + "</title>");
    </script>
   </head>
   <body>
    <script language="JavaScript">
      DataInterface.initialize();
      DataInterface.bindToPage(CurrentPage);
      ImageLoader.preload(CurrentPage);
      LinkLoader.bindToContext(CurrentPage);

      PagePrinter.printHeader(CurrentPage);
      PagePrinter.printNavigation(CurrentPage);
      PagePrinter.printTitle(CurrentPage);
      PagePrinter.printSubTitle(CurrentPage);
      PagePrinter.printMainContent(CurrentPage);
      PagePrinter.printFooter(CurrentPage);

      DataInterface.close();
      ImageLoader.close();
      LinkLoader.close();
      PagePrinter.close();
    </script>
   </body>
</html>

The entire content of the page was being generated and displayed by a series of JavaScript objects, which in turn were being generated by a series of PHP scripts on the server! Upon loading any page of this site, a browser with JavaScript disabled would display an empty window.

If that weren’t ridiculous enough, the PHP scripts responsible for generating the JavaScript code determined what needed to be displayed on the page based on the address of the HTML page, as reported by the unreliable HTTP Referer header:

function dynsitebase_PagePrinter_render()
{
  echo "var PagePrinter = new Object()";

  echo "PagePrinter.printHeader = function(pageObj)";
  echo "{";
  echo "  document.write("<div class='$css_headerdivclass'>");";
  echo "  document.write("<h1 class='$css_h1headerdivclass'>");";
  echo "  if (pageObj.header) ";
  echo "  {";
  echo "    document.write(pageObj.header);";
  echo "  }";
  echo "  else";
  echo "  {";
  echo "    document.write("$headerToRender");";
  echo "  }";

  ...

}

Worse than code written by someone who isn’t quite fluent in JavaScript or PHP, the author of this monstrosity obviously knew the languages in question rather well. What he or she lacked was an understanding of what makes code robust, efficient and maintainable.

Read The Daily WTF (RSS feed); it’ll make you feel better about yourself. If it doesn’t, you might need to take a remedial course in computer science.

Kevin YankKevin Yank
View Author

Kevin Yank is an accomplished web developer, speaker, trainer and author of Build Your Own Database Driven Website Using PHP & MySQL and Co-Author of Simply JavaScript and Everything You Know About CSS is Wrong! Kevin loves to share his wealth of knowledge and it didn't stop at books, he's also the course instructor to 3 online courses in web development. Currently Kevin is the Director of Front End Engineering at Culture Amp.

Share this article
Read Next
Get the freshest news and resources for developers, designers and digital creators in your inbox each week