By Ben Stallings |

A few years ago I contributed a section to an article on Wikipedia, but the editors felt it was not sufficiently notable to keep it in the article, so I'm sharing it here instead.

Macaroni code

By analogy to macaronic language, macaroni code mixes two or more computer languages together in a single document. Common examples include embedding regular expressions or SQL queries in a programming language, and embedding CSS or JavaScript in HTML – or conversely HTML fragments in JavaScript. Particularly complex examples occur in server-side scripting languages such as Active Server Pages and PHP, which are explicitly intended to be embedded in HTML code. The HTML may then contain CSS, JavaScript, and PHP, while the JavaScript may itself contain HTML and PHP (potentially recursively), and the PHP may contain regular expressions and SQL. In these cases it is possible to use four or more languages in a single document, as shown in this "Hello World" example:

<!DOCTYPE html>
        <html>
        <head><title>Macaronic Code</title></head>
        <body>
            <?php
                $ip = $_SERVER['REMOTE_ADDR'];
                $dbh = new PDO(
                  'mysql:host=localhost;dbname=mydb',
                  'username',
                  'password'
                );
                $statement = $dbh->query(
                  "SELECT lastlog FROM logins WHERE ip = '$ip'"
                );
                $row = $statement->fetch(PDO::FETCH_ASSOC);
                $dbh->query("
                  INSERT INTO logins VALUES ('$ip', CURRENT_TIMESTAMP) 
                  ON DUPLICATE KEY UPDATE lastlog = CURRENT_TIMESTAMP
                ");
            ?>
            <p>Hello, <?php print $ip; ?>.</p>
            <script>
                var lastlog = "<?php print $row['lastlog']?>";
                if (lastlog > "") alert("You last visited " + lastlog);
                else alert("You've never been here before.");
            </script>
        </body>
        </html>
        

The above example shows HTML (red) containing PHP (orange) and Javascript (green), with the PHP in turn containing SQL (blue) and the Javascript containing PHP. The Javascript is necessary to display an alert box; the SQL is necessary to store and retrieve data in a database; and the PHP is necessary to determine the user's IP address and interface with the database.

Because macaroni code can be difficult to read and maintain, particularly for people who do not know all of the languages used, open-source projects frequently take pains to isolate the various languages from each other in separate files. The above example could be rewritten as four separate files (.html and .js sent to the browser and .php and .sql remaining on the server), but the JavaScript would need to send an AJAX request to the PHP script to retrieve the values of the two variables it needs to complete the page. Loading the page would thus require three HTTP requests (for the .html, .js, and AJAX) instead of just one for the file of macaroni code.