Skip to content

Commit 25d8e74

Browse files
author
janschloesser
committed
📦 Update presentation & documentation to compiled final versions
1 parent 6705040 commit 25d8e74

File tree

5 files changed

+160
-11
lines changed

5 files changed

+160
-11
lines changed

‎docs/output/index.html

Lines changed: 160 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -35,19 +35,45 @@ <h2>Ein Einblick in die Welt des Proxies in PHP</h2>
3535
<div class="inner clearfix">
3636
<section id="main-content">
3737

38-
<h1 id="entwurfsmuster-proxy---eine-einfuhrung">Entwurfsmuster Proxy - eine Einführung</h1>
39-
<h2 id="faiconcrosshairs-absicht">\faicon{crosshairs} Absicht</h2>
40-
<p>Das Proxy-Entwurfsmuster ist ein <strong><a href="https://de.wikipedia.org/wiki/Entwurfsmuster_(Buch)">GoF</a>-Strukturmuster</strong> und stellt dir ein Stellvertreter-Objekt oder Platzhalter (<em>Proxy</em>) für ein anderes Objekt (<em>Subjekt</em>) zur Verfügung. Es bietet dir dadurch Kontrolle über die Objekterzeugung des Subjekts und dessen Zugriff darauf.</p>
41-
<h2 id="faiconthumbs-up-motivation">\faicon{thumbs-up} Motivation</h2>
38+
<h1 id="das-entwurfsmuster-proxy">Das Entwurfsmuster: Proxy</h1>
39+
<p>Das Proxy-Entwurfsmuster ist ein <strong><a href="https://de.wikipedia.org/wiki/Entwurfsmuster_(Buch)">GoF</a>-Strukturmuster</strong>
40+
und stellt dir ein Stellvertreter-Objekt oder Platzhalter (<em>Proxy</em>) für ein anderes Objekt (<em>Subjekt</em>)
41+
zur Verfügung.</p>
42+
<h2 id="faiconcrosshairs-hspace.1cm-absicht">\faicon{crosshairs} \hspace{.1cm} Absicht</h2>
43+
<p>Das Proxy-Muster bietet dir Kontrolle über die Objekterzeugung des Subjekts und dessen Zugriff
44+
darauf.</p>
45+
<h2 id="faiconthumbs-up-hspace.1cm-motivation">\faicon{thumbs-up} \hspace{.1cm} Motivation</h2>
4246
<h3 id="langweilig---die-erste-sicherer-browser-dank-zugriffsproxy">Langweilig - die Erste: Sicherer Browser dank Zugriffsproxy</h3>
43-
<p>Stell dir mal vor, dass Du einen sicheren Browser entwickeln möchtest, welcher aus Kostengründen allerdings z.B. bereits vorhandene Browser-Schnittstellen im Hintergrund verwenden soll. Damit die Nutzer deines Browsers vor Datendiebstahl geschützt sind, soll dein Browser nur sichere HTTPS-Verbindungen erlauben und alle unsicheren HTTP-Verbindungen blockieren. Da der Quelltext deiner Engine allerdings nicht verändert werden kann/darf (z.B. aus Lizenzgründen), kannst Du die Zugriffsbeschränkung auf HTTPS nicht einfach so in das Ursprungsobjekt einfügen. Jetzt kommt dein <em>Zugriffsproxy</em> ins Spiel: Er kontrolliert den Zugriff auf den relevanten Teil der Browser-Schnittstelle (hier das Subjekt) und delegiert alle weiteren Methodenaufrufe direkt an das Subjekt weiter. Somit muss der Quelltext deiner geplanten Engine nicht verändert werden und alle sind glücklich!</p>
44-
<h3 id="motiviert---die-zweite-lazy-loading-mit-virtuellem-proxy">Motiviert - die Zweite: Lazy Loading mit virtuellem Proxy</h3>
45-
<p>Ein weiteres sehr simples Beispiel, warum Du den Zugriff zu einem Objekt kontrollieren möchtest, ist ein <em>virtueller Proxy</em> zum verzögerten Laden eines Bildes (Lazy Loading). Es ist nämlich nicht immer notwendig, dass ein Bild bereits beim Instanzzieren eines Objekts in den Speicher geladen werden muss.</p>
46-
<p>Stell dir vor, dass Du ganz viele Bilder auf deiner Werbe-Website deines sicheren Browsers hast. Da viele dieser Bilder im unteren unsichtbaren Bereich (“below the fold”) sind, ist es beim Laden der Website nicht sinnvoll, noch nicht sichtbare Bilder deiner Website zu laden - es reicht also, dass nur diese Bilder geladen werden, die aktuell tatsächlich im sichtbaren Bereich der Website sind. Die folgende Abbildung zeigt das Lazy-Loading anhand einer kürzlich benutzten horizontalen Scrollbalken:</p>
47-
<p><img src="../assets/images/lazyloading.jpg" alt="Beispiel des Lazy-Loading anhang einer vertikalen Scrollbar" /></p>
47+
<p>Stell dir mal vor, dass du einen sicheren Browser entwickeln möchtest, welcher aus Kostengründen
48+
allerdings z. B. bereits vorhandene Browserschnittstellen im Hintergrund verwenden soll. Damit die
49+
Nutzer deines Browsers vor Datendiebstahl geschützt sind, soll dein Browser nur sichere
50+
HTTPS-Verbindungen erlauben und alle unsicheren HTTP-Verbindungen blockieren. Da der Quelltext deiner
51+
Engine allerdings nicht verändert werden kann/darf (z. B. aus Lizenzgründen), kannst du die
52+
Zugriffsbeschränkung auf HTTPS nicht einfach so in das Ursprungsobjekt einfügen. Jetzt kommt dein <em>Zugriffsproxy</em>
53+
ins Spiel: Er kontrolliert den Zugriff auf den relevanten Teil der Browserschnittstelle (hier das
54+
Subjekt) und delegiert alle weiteren Methodenaufrufe direkt an das Subjekt weiter. Somit muss der
55+
Quelltext deiner geplanten Engine nicht verändert werden und alle sind glücklich!</p>
56+
<h3 id="motiviert---die-zweite-lazy-loading-mit-virtuellem-proxy">Motiviert - die Zweite: Lazy-Loading mit
57+
virtuellem Proxy</h3>
58+
<p>Ein weiteres sehr simples Beispiel, warum du den Zugriff zu einem Objekt kontrollieren möchtest, ist ein
59+
<em>virtueller Proxy</em> zum verzögerten Laden eines Bildes (Lazy Loading). Es ist nämlich nicht immer
60+
notwendig, dass ein Bild bereits beim Instanzzieren eines Objekts in den Speicher geladen werden muss.
61+
</p>
62+
<p>Stell dir vor, dass du ganz viele Bilder auf deiner Werbe-Website deines sicheren Browsers hast. Da viele
63+
dieser Bilder im unteren unsichtbaren Bereich (“below the fold”) sind, ist es beim Laden der Website
64+
nicht sinnvoll, noch nicht sichtbare Bilder deiner Website zu laden - es reicht also, dass nur diese
65+
Bilder geladen werden, die aktuell tatsächlich im sichtbaren Bereich der Website sind. Die folgende
66+
Abbildung zeigt das Lazy-Loading anhand einer kürzlich benutzten horizontalen Scrollbalken:</p>
67+
<figure>
68+
<img src="../assets/images/lazyloading.jpg"
69+
alt="Beispiel des Lazy-Loading anhang einer vertikalen Scrollbar"/>
70+
<figcaption>Beispiel des Lazy-Loading anhang einer vertikalen Scrollbar</figcaption>
71+
</figure>
4872
<p>Das Laden des realen Bildes (also das Subjekt) wird also in diesem Beispiel durch einen Stellvertreter vertreten (Proxy) und der Zugriff auf das tatsächliche Objekt wird soweit verzögert, bis er wirklich erst notwendig ist.</p>
4973
<h3 id="hochmotiviert---die-dritte-reporting-der-downloads-dank-remote-proxy">Hochmotiviert - die Dritte: Reporting der Downloads dank Remote-Proxy</h3>
50-
<p>Da du natürlich am Ende des Tages wissen möchtest, ob dein sicherer Browser von den Nutzer tatsächlich heruntergeladen wird, hast du dir bei der Planung der Website bereits einige Download-Statistiken überlegt:</p>
74+
<p>Da du natürlich am Ende des Tages wissen möchtest, ob dein sicherer Browser von den Nutzern tatsächlich
75+
heruntergeladen wird, hast du dir bei der Planung der Website bereits einige Download-Statistiken
76+
überlegt:</p>
5177
<ul>
5278
<li>
5379
Datum
@@ -59,7 +85,130 @@ <h3 id="hochmotiviert---die-dritte-reporting-der-downloads-dank-remote-proxy">Ho
5985
Endgerätetyp
6086
</li>
6187
</ul>
62-
<p>Diese Statistiken werden über die Downloads über deine Website generiert. Da du den Browser aber noch zusätzlich auf Download-Portalen anbietest, musst du diese Zahlen natürlich ebenfalls in deine Statistik miteinbeziehen. Alle Download-Portale bieten dir API-Schnittstellen an, welche ebenfalls die oben genannten Daten liefern. Mithilfe des Proxy-Objekts kannst du nun in die ursprüngliche Zugriffkontrolle des Statistik-Objekts eingreifen und z.B. die Eigenschaften des Objekts auf die von der jeweiligen API-Schnittstelle zur Verfügung gestellten Daten setzen. Weitere Methoden vom Proxies werden dann einfach an das eigentliche Reportobjekt (unserem Subjekt) delegiert.</p>
88+
<p>Diese Statistiken werden über die Downloads über deine Website generiert. Da du den Browser aber noch
89+
zusätzlich auf Download-Portalen anbietest, musst du diese Zahlen natürlich ebenfalls in deine Statistik
90+
miteinbeziehen. Alle Download-Portale bieten dir API-Schnittstellen an, welche ebenfalls die oben
91+
genannten Daten liefern. Mithilfe des Proxy-Objekts kannst du nun in die ursprüngliche Zugriffkontrolle
92+
des Statistik-Objekts eingreifen und z. B. die Eigenschaften des Objekts auf die von der jeweiligen
93+
API-Schnittstelle zur Verfügung gestellten Daten setzen. Weitere Methoden vom Proxies werden dann
94+
einfach an das eigentliche Reportobjekt (unserem Subjekt) delegiert.</p>
95+
<h2 id="faiconsitemap-hspace.1cm-struktur-sequenzdiagram">\faicon{sitemap} \hspace{.1cm} Struktur &amp;
96+
Sequenzdiagram</h2>
97+
<p><img src="../assets/images/proxy_class_diagram.png" alt="Klassendiagram des Proxy-Musters"
98+
class="float-left" style="width:60.0%"/> <img src="../assets/images/proxy_sequence_diagram.png"
99+
alt="Sequenzdiagram des Proxy-Musters"
100+
style="width:40.0%"/></p>
101+
<ul>
102+
<li>
103+
<strong>ISubject</strong> definiert das Interface für das Subjekt und den Proxy
104+
</li>
105+
<li>
106+
<strong>Subject</strong> ist die Klasse, welche die eigentliche Logik implementiert
107+
</li>
108+
<li>
109+
<strong>Proxy</strong> beinhaltet eine Eigenschaft, die eine Referenz zum Subjekt speichert.
110+
Methodenaufrufe werden in der Regel anschließend an das Subjekt delegiert.
111+
</li>
112+
<li>
113+
<strong>Client</strong> ruft Methodenaufrufe über das definierte ISubject auf, sodass das <a
114+
href="https://de.wikipedia.org/wiki/Liskovsches_Substitutionsprinzip">Liskovsche
115+
Substitutionsprinzip (LSP)</a> erfüllt bleibt. Er kann also mit beiden Klassen gleichweise
116+
kommunizieren.
117+
</li>
118+
</ul>
119+
<h2 id="faiconbullhorn-hspace.1cm-verwendbarkeit">\faicon{bullhorn} \hspace{.1cm} Verwendbarkeit</h2>
120+
<p>Proxies werden häufig in Situationen verwendet, in welcher anstelle eines normalen Zeigers eine
121+
komplexere Referenz auf ein Objekt notwendig ist. Es wird dabei meistens unter folgende Arten von
122+
Proxies unterschieden:</p>
123+
<ul>
124+
<li>
125+
<strong>Virtual Proxies</strong> verzögern die Instanziierung eines Objekts (Lazy Loading)
126+
</li>
127+
<li>
128+
<strong>Remote Proxies</strong> kontrollieren den Zugriff auf ein entferntes Objekt
129+
</li>
130+
<li>
131+
<strong>Protection Proxies</strong> ermöglichen eine Zugriffskontrolle auf das Subjekt
132+
</li>
133+
<li>
134+
<strong>Cache Proxies</strong> ermöglichen die Zwischenspeicherung zur schnelleren Auslieferung an
135+
den Client
136+
</li>
137+
<li>
138+
<strong>Logging Proxies</strong> ermöglichen das Protokollieren eines Aufrufs, bevor dieser an das
139+
Subjekt delegiert wird.
140+
</li>
141+
</ul>
142+
<p>Es existieren noch einige weitere Arten des Proxy-Pattern, welche allerdings seltener verwendet
143+
werden.</p>
144+
<h2 id="faiconamerican-sign-language-interpreting-hspace.1cm-in-der-realen-welt">
145+
\faicon{american-sign-language-interpreting} \hspace{.1cm} In der realen Welt</h2>
146+
<p>Auch in der realen Welt verwenden wir regelmäßig die Prinzipien von Proxies. Nehmen wir mal an, du
147+
möchtest beim Aldi nebenan deinen wöchentlichen Einkauf mit deiner Kreditkarte/Girocard bezahlen. Dabei
148+
ist deine Karte sozusagen der Proxy für dein Bankkonto. Deine Kreditkarte erlaubt dem Ladeninhaber das
149+
Gelf für die Ware zu erhalten, ohne das er direkten Zugriff auf dein gesamtes Bankkonto erhält.</p>
150+
<h2 id="faiconcode-hspace.1cm-proxy-programmierbeispiele-in-php">\faicon{code} \hspace{.1cm}
151+
Proxy-Programmierbeispiele in PHP</h2>
152+
<div class="sourceCode" id="cb1"><pre class="sourceCode bash"><code class="sourceCode bash"><a
153+
class="sourceLine" id="cb1-1" data-line-number="1"><span class="bu">cd</span> ~/Sites/</a>
154+
<a class="sourceLine" id="cb1-2" data-line-number="2"><span class="fu">git</span> clone https://github.com/it4need/php-proxy-pattern</a></code></pre>
155+
</div>
156+
<p>Damit du das Proxy-Pattern von Grund auf verstehst, gibt es im <a
157+
href="https://github.com/it4need/php-proxy-pattern">Repository</a> einige Beispiele in PHP zu den
158+
jeweiligen Proxy-Varianten. Du findest im Repository ebenfalls Unit-Tests, damit du den Sinn von den
159+
einzelnen Proxies verstehst. Die Tests sind gleichzeitig deine Dokumentation für die Anwendung des
160+
Musters.</p>
161+
<h2 id="faiconthumbs-up-hspace.1cm-vorteile">\faicon{thumbs-up} \hspace{.1cm} Vorteile</h2>
162+
<ul>
163+
<li>
164+
Proxies können den Zugang zu Objekten kontrollieren, bevor sie die Methodenaufrufe an das Subjekt
165+
delegieren
166+
</li>
167+
<li>
168+
Der Client bemerkt die Kontrolle des Objekts nicht
169+
</li>
170+
<li>
171+
Proxies funktionieren ebenfalls, wenn das eigentliche Objekt noch nicht im Speicher verfügbar ist
172+
(z.B. Lazy Loading)
173+
</li>
174+
<li>
175+
Proxies können helfen, die Geschwindigkeit der Applikation zu steigern (z.B. Caching)
176+
</li>
177+
<li>
178+
Proxies können die Interprozesskommunikation/Fernkommunikation zwischen Objekten ermöglichen
179+
</li>
180+
</ul>
181+
<h2 id="faiconthumbs-down-hspace.1cm-nachteile">\faicon{thumbs-down} \hspace{.1cm} Nachteile</h2>
182+
<ul>
183+
<li>
184+
Proxies können je nach Implementierung die Antwortzeit verzögern
185+
</li>
186+
<li>
187+
Proxies fügen eine weitere Abstraktionsschicht ein, welche zu Umwegen führen kann und die
188+
Komplexität steigert
189+
</li>
190+
<li>
191+
Es müssen alle von der Schnittstelle definierten Methoden für das Proxy erstellt und an das Subjekt
192+
delegiert werden
193+
</li>
194+
</ul>
195+
<h2 id="faiconbezier-curve-hspace.1cm-beziehungen-zu-anderen-entwurfsmuster">\faicon{bezier-curve}
196+
\hspace{.1cm} Beziehungen zu anderen Entwurfsmuster</h2>
197+
<ul>
198+
<li>
199+
Das <a href="https://de.wikipedia.org/wiki/Decorator"><em>Decorator</em>-Entwurfsmuster</a> sieht
200+
ähnlich aus, hat allerdings ein anderes Ziel: Er fügt zusätzliches Verhalten hinzu.
201+
</li>
202+
<li>
203+
Das <a href="https://de.wikipedia.org/wiki/Fassade_(Entwurfsmuster)"><em>Facade</em>-Pattern</a>
204+
kontrolliert nicht den Zugriff auf das Objekt; es stellt eine andere Schnittstelle bereit
205+
</li>
206+
<li>
207+
Das <a href="https://de.wikipedia.org/wiki/Adapter_(Entwurfsmuster)"><em>Adapter</em>-Pattern</a>
208+
verändert im Gegensatz zum Proxy-Entwurfsmuster die Schnittstellendefinition, aber nicht die
209+
Geschäftslogik (sinnbildmäßiger Stromadapter).
210+
</li>
211+
</ul>
63212

64213
<br /><br /><p class="repo-owner"><small>Das <a href="https://github.com/jasonlong/architect-theme">architect-theme</a> ist ein Produkt von <a href="https://github.com/jasonlong">jasonlong</a>.</small></p>
65214
</section>

‎docs/output/proxy-pattern.pdf

96.4 KB
Binary file not shown.

‎presentation/Proxy_Design_Pattern.key

128 KB
Binary file not shown.

‎presentation/Proxy_Design_Pattern.pdf

80.8 KB
Binary file not shown.

‎presentation/Proxy_Design_Pattern.pptx

4.18 MB
Binary file not shown.

0 commit comments

Comments
 (0)