From bf996f7247133c536511c23b6ad30aa222bfd6d9 Mon Sep 17 00:00:00 2001 From: Thomas Lange Date: Wed, 15 Apr 2015 21:29:19 +0200 Subject: Initial commit --- index.php | 79 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 79 insertions(+) create mode 100755 index.php (limited to 'index.php') diff --git a/index.php b/index.php new file mode 100755 index 0000000..7f3de69 --- /dev/null +++ b/index.php @@ -0,0 +1,79 @@ +addHTML('

I AM JUST A PAGELET WITH RED BACKGROUND

'); +$PageletRed->addCSS('static/red.php'); +$PageletRed->addJS('static/delayJS.php'); +$PageletRed->addJSCode("document.getElementById('red').innerHTML += ' [JS executed]';document.getElementById('red').style.borderRadius = '30px';"); + +#==================================================================================================== +# Pagelet mit blauem Hintergrund +#==================================================================================================== +$PageletBlue = new Pagelet(60); +$PageletBlue->addHTML('

I AM JUST A PAGELET WITH BLUE BACKGROUND

'); +$PageletBlue->addCSS('static/blue.php'); +$PageletBlue->addJS('static/delayJS.php'); +$PageletBlue->addJSCode("document.getElementById('blue').innerHTML += ' [JS executed]';document.getElementById('blue').style.borderRadius = '30px';"); + +#==================================================================================================== +# Pagelet mit grünem Hintergrund +#==================================================================================================== +$PageletGreen = new Pagelet(); +$PageletGreen->addHTML('

I AM JUST A PAGELET WITH GREEN BACKGROUND

'); +$PageletGreen->addCSS('static/green.php'); +$PageletGreen->addJS('static/delayJS.php'); +$PageletGreen->addJSCode("document.getElementById('green').innerHTML += ' [JS executed]';document.getElementById('green').style.borderRadius = '30px';"); +?> + + + + + + + + + + BigPipe Example + + +

BigPipe Example

Auf dieser Beispielseite werden insgesamt 3 Pagelets gerendert von denen alle jeweils eine CSS- und eine JS-Ressource haben. Wobei jede der CSS-Ressourcen die Hintergrundfarbe des zugehörigen Pagelets ändert. +BigPipe wird hingehen und diese Pagelets der Reihe nach rendern. Dabei werden zuerst die zugehörigen CSS-Ressourcen geladen und dann der HTML-Code injiziert. Wenn dann von allen Pagelets die CSS-Ressourcen geladen +und der HTML-Code injiziert ist, dann wird BigPipe die JS-Ressourcen der Pagelets einbinden und den statischen Javascript-Code (falls vorhanden) ausführen. Damit man den Pipeline-Effekt auf dieser Beispielseite auch +sieht werden die CSS- und JS-Ressourcen über ein Delayscript geleitet. Debuginformationen findest du in der Javascript-Konsole.

+ +

Weitere Informationen: https://blackphantom.de/artikel/bigpipe-website-pipelining-und-schnellerer-aufbau-durch-einzelne-pagelets/

+ + + + + + \ No newline at end of file -- cgit v1.2.3