PHP vs JavaScript: Server, Browser und Node.js

PHP läuft auf dem Server: Es baut die Seite, schickt das fertige HTML und hört dann auf. JavaScript läuft im Browser des Besuchers, wo es auf Klicks reagiert und die Seite nach dem Laden verändert; mit Node.js läuft es auch auf dem Server. Die beiden sind also weniger Rivalen als Partner: Eine typische Website nutzt PHP (oder Node.js) auf dem Server und JavaScript im Browser.

Dieser PHP-Code läuft auf dem Server. Der Browser bekommt nur, was er ausgibt, und der Tab Page zeigt dieses Ergebnis:

<?php
$products = [
    ["name" => "Keyboard", "price" => 49],
    ["name" => "Mouse", "price" => 19],
    ["name" => "Monitor", "price" => 189],
];
$total = array_sum(array_column($products, "price"));
?>
<h2>Cart</h2>
<ul>
<?php foreach ($products as $p): ?>
    <li><?= $p["name"] ?>: $<?= $p["price"] ?></li>
<?php endforeach; ?>
</ul>
<p>Total: $<?= $total ?></p>

Schau dir den Tab Output an: Darin ist kein PHP mehr, nur HTML. Dieselbe Liste, von JavaScript im Browser gebaut, sieht so aus:

const products = [
  { name: "Keyboard", price: 49 },
  { name: "Mouse", price: 19 },
  { name: "Monitor", price: 189 },
];

const ul = document.querySelector("#cart"); // an empty <ul id="cart"> in the HTML
for (const p of products) {
  const li = document.createElement("li");
  li.textContent = `${p.name}: $${p.price}`;
  ul.append(li);
}

Die PHP-Version schickt eine vollständige Seite, die Suchmaschinen und langsame Handys sofort lesen. Die JavaScript-Version kann die Liste später ohne Neuladen aktualisieren, etwa wenn der Besucher einen Eintrag entfernt.

Wo welche Sprache läuft

Die letzte Zeile ist für die Sicherheit wichtig: Alles im JavaScript des Browsers ist für den Besucher sichtbar, also gehören Passwörter, API-Schlüssel und Preisprüfungen auf den Server.

Syntax im direkten Vergleich

Die beiden Sprachen sehen sich ähnlich, weil beide von C abstammen: geschweifte Klammern, if, for, while, function, return. Die Unterschiede stecken in den Details:

Hier ist eine Funktion mit Callback in PHP:

<?php
$prices = [12.5, 8, 30, 4.25];

$withTax = array_map(fn($p) => round($p * 1.2, 2), $prices);
$cheap = array_filter($withTax, fn($p) => $p < 15);

echo implode(", ", $withTax), "\n";
echo "Under 15: " . implode(", ", $cheap) . "\n";
echo "Count: " . count($cheap) . "\n";

Und in JavaScript, wo map und filter Methoden des Arrays sind:

const prices = [12.5, 8, 30, 4.25];

const withTax = prices.map((p) => Math.round(p * 1.2 * 100) / 100);
const cheap = withTax.filter((p) => p < 15);

console.log(withTax.join(", "));
console.log("Under 15: " + cheap.join(", "));

Der Operator +: die klassische Falle

In JavaScript addiert + Zahlen und verbindet Strings, sodass ein String an beliebiger Stelle die Addition in eine Verkettung verwandelt. PHP hält beides auseinander: + addiert immer und . verbindet immer.

<?php
var_dump("10" + 5);     // int(15): + always adds
var_dump("10" . 5);     // string "105": . always joins
var_dump(10 . "");      // number to string
var_dump("3" * "4");    // numeric strings multiply
var_dump(0.1 + 0.2 === 0.3); // floats are inexact in both languages

console.log("10" + 5);  // "105"
console.log("10" - 5);  // 5
console.log("3" * "4"); // 12
console.log(0.1 + 0.2 === 0.3); // false

Beide Sprachen haben außerdem das lockere == und das strikte ===. Der Rat ist in beiden derselbe: Verwende ===, außer du willst bewusst über Typen hinweg vergleichen.

Daten von PHP an JavaScript übergeben

PHP läuft zuerst und kann deshalb Daten direkt in die Seite schreiben, die das JavaScript im Browser dann verwendet. json_encode macht aus einem PHP-Array gültiges JavaScript:

<?php
$user = ["name" => "Ada", "role" => "admin", "unread" => 3];
?>
<p id="greeting">Loading...</p>
<script>
const user = <?= json_encode($user, JSON_HEX_TAG | JSON_HEX_AMP) ?>;
document.getElementById("greeting").textContent =
    "Hi " + user.name + ", you have " + user.unread + " new messages";
</script>

Der Tab Output zeigt das erzeugte Skript mit bereits eingesetzten Daten. Das Flag JSON_HEX_TAG escapt < und >, sodass ein Wert mit </script> das Skript nicht vorzeitig beenden kann. Mehr zu den Optionen unter json_encode.

Die andere Richtung läuft über HTTP: Das JavaScript im Browser ruft fetch("/api/cart.php") auf, das PHP-Skript läuft und antwortet mit JSON:

<?php
// api/cart.php
header('Content-Type: application/json');
echo json_encode(['items' => 3, 'total' => 257]);

const res = await fetch("/api/cart.php");
const cart = await res.json();
console.log(cart.total); // 257

PHP vs Node.js auf dem Server

Wenn JavaScript über Node.js auf dem Server läuft, wird der Vergleich zu einer echten Entscheidung.

PHPs Modell verzeiht viel: Ein Bug oder ein Speicherleck betrifft nur eine Anfrage, und jede Anfrage startet sauber. Nodes Modell kann Zustand und Verbindungen offen halten, was zu Chats und Live-Dashboards passt, aber ein Absturz oder eine blockierende Schleife trifft jeden Nutzer dieses Prozesses.

Was du lernen solltest

JavaScript brauchst du für jede interaktive Webseite, denn es ist die einzige Sprache, die Browser ausführen. Die Frage ist, was auf dem Server läuft:

• Lern als Nächstes PHP, wenn du mit WordPress, Laravel oder den vielen bestehenden PHP-Websites arbeiten willst oder den einfachsten Weg suchst, eine dynamische Website auf günstiges Hosting zu bringen. Fang an mit was PHP ist.
• Bleib bei JavaScript (Node.js), wenn du eine Sprache für den ganzen Stack willst oder Echtzeit-Features baust.

Ein üblicher Weg ist HTML und CSS, dann JavaScript im Browser, dann eine Serversprache. Egal welche Serversprache du wählst: Formulare, Sessions, Datenbanken und JSON-APIs beruhen auf denselben HTTP-Ideen, das Wissen lässt sich also übertragen.