Software Engineering

Lecture 06 – Design Patterns:

Introduction
© 2015-20 Dr. Florian Echtler
Bauhaus-Universität Weimar
<[email protected]>

This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.
Design Patterns
●
“Recipes” for common problems
●
Available on different levels (e.g. system architecture, user interface,
implementation)
●
Usually without any code, at most UML
●
Often just “box-and-line”-diagrams, esp. for architectural patterns

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 2

Description of a Design Pattern
●
Problem
– Motivation/application area
●
Solution
– Structure (class diagram)
– Pieces (names of classes or operations)
– Object interaction (e.g. sequence diagram)
●
Discussion
– Advantages, disadvantages, dependencies
– Constraints, special cases, known uses

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 3

Design Patterns: History
●
Originally from architecture and construction
●
“A Pattern Language: Towns, Buildings, Construction”, Christopher
Alexander, 1977
– “Each pattern describes a problem which occurs over and over again in our
environment, and then describes the core of the solution to that problem, in
such a way that you can use this solution a million times over, without ever
doing it the same way twice.”

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 4

“A Pattern Language” examples
Image source (FU): “A Pattern Language”, C. Alexander

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 5

Architecture Patterns
●
High-level patterns: view of entire system
●
Multiple overlapping views possible
●
Examples:
– Model-View-Controller
– Client-Server architecture
– Layered architecture
– Repository pattern
– Pipe-and-Filter architecture

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 6

Model-View-Controller (MVC)
●
Suitable for UI applications
●
3 logical components:
– Model: manages data & associated operations
– View: defines/manages presentation to user
– Controller: manages user interaction
●
Advantages:
– Data can change independently from presentation
●
Disadvantages:
– Can cause extra complexity for simple data models
28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 7
Model-View-Controller
Image source (PD): https://en.wikipedia.org/wiki/Model%E2%80%93view%E2%80%93controller

e.g.
back-
end

e.g. e.g.
web web
browser server

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 8

MVC Examples
●
Website
– HTML ( M ), CSS ( V ), Browser ( C )
●
Android app:
– Database ( M ), Fragments ( V ), Java code ( C )
●
Web application:
– Backend ( M ), Browser ( V ), Webserver ( C )
– Database ( M ), Browser ( V ), PHP app ( C )

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 9

Client-server architecture
●
Functionality split into services
●
Every service provided by one (logical) server
– Accessing shared data from multiple locations
– Load balancing → replicate servers
●
Advantages:
– Distributed, network-transparent architecture
●
Disadvantages:
– Every server → single point of failure
– Network performance unpredictable
28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 10
Client-server architecture
Image source (FU): Sommerville, Software Engineering, Chapter 6

Client 1 Client 2 Client 3 ...

Network Network Network Network Network

Catalogue Video Image Web

server server server server

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 11

Layered architecture
●
System as a stack of interconnected layers
– Layers only communicate with neighbours
– Increasing complexity from top to bottom
●
Often used for network protocols
●
Advantages:
– Individual layers can be replaced
– Clear interface specification built in
●
Disadvantages:
– Clean separation can be difficult
28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 12
Example: layered UI architecture

Browser

Web Application
Question:
where to put
Database security
features?
Support/HAL/OS

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 13

ISO/OSI network model

Application Application
Presentation Presentation
Session Session
Transport Transport
Network Network
Data Link Data Link
Physical Physical

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 14

Internet network model

Application/
HTTP (HyperText Transfer Protocol) Presentation

TLS (Transport Layer Security) Session

TCP (Transmission Control Protocol) Transport

IP (Internet Protocol) Network

802.11* MAC/LLC (WLAN Management) Data Link

802.11* PHY (Wireless Hardware) Physical

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 15

Internet network model (2)
●
Layered protocols → nested data packets
(think of Russian Dolls)
●
Packets consist of header + payload
●
Payload of protocol 1 = packet of protocol 2

PHY LLC IP TCP TLS HTTP actual payload data

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 16

Repository pattern
●
All data is managed in a central repository/DB
– Components do not interact directly
– Only communicate with the repository
●
Advantages:
– Components can be independent
– Easy data management (e.g. backups)
●
Disadvantages:
– Single point of failure, may be inefficient
– Distribution/synchronization difficult

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 17

Repository pattern: CASE system
Image source (FU): Sommerville, Software Engineering, Chapter 6

UML Code
editor generator

C++
editor
Debugger Project Repository
Java
editor

Code Compiler
analyzer + linker

CASE = Computer Aided Software Engineering, e.g. Eclipse

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 18

Pipe-and-Filter architecture
●
Suitable for audio/video processing, computer vision, text processing
…
– Many components (filters) which provide data transformations
– Data flows through pipes/network of components
●
Advantages:
– Easy to extend, matches many real-world processes
●
Disadvantages:
– Requires either common data format or costly conversions

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 19

Pipe-and-Filter architecture
Image source (FU): https://msdn.microsoft.com/en-us/library/dd318616%28v=vs.85%29.aspx

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 20

Architecture Considerations
●
Performance – Minimize communications, use large-grained
components
●
Security – use e.g. layered architecture with critical assets in inner
layers
●
Safety – Localize safety-critical features in few subsystems
●
Availability – Include redundant components
●
Maintainability – Use small, replaceable components

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 21

Design patterns for program code
●
Reference: “Design Patterns – Elements of Reusable Object-Oriented
Software” by Gamma, Helm, Johnson and Vlissides
●
Also known as Gamma-, “GangOfFour”- or “GoF”-Book
●
“Distillation” of 23 common patterns from existing code
●
3 major categories: creational, structural and behavioral patterns

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 22

Creational patterns
●
Used to create other objects
●
Rules-of-thumb: http://www.vincehuston.org/dp/creational_rules.html
●
Examples:
– Singleton
– AbstractFactory
– FactoryMethod
– Prototype

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 23

Singleton
●
Common problem: use only a single instance of a certain class (e.g. a
Factory)
●
Creation of additional instances should not be possible
●
Solution: make class responsible for its own singular instance

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 24

Singleton: Code example
Source (FU): http://www.vincehuston.org/dp/singleton.html

public class GlobalClass {

private int m_value;

private static GlobalClass s_instance = null;

protected GlobalClass( int v ) { m_value = v; }

public int get() { return m_value; }

public void set( int v ) { m_value = v; }

public static GlobalClass instance() {

if ( s_instance == null )
s_instance = new GlobalClass(0);
return s_instance;
}
}

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 25

AbstractFactory
●
Use Factory object to delegate object creation
●
Useful for multiple families of similar objects
●
Exact type determined by specific factory
●
Example: different classes of UI elements

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 26

AbstractFactory (2)
Image source (CC): https://en.wikipedia.org/wiki/Abstract_factory_pattern

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 27

AbstractFactory: Code example
Source (FU): http://www.vincehuston.org/dp/abstract_factory.html

Before: After:
void display_window_one() { GUIFactory factory;
if (windows) {
Widget w[] = { if (windows) {
new WinButton(), Factory = new WinFactory();
new WinMenu() } else if (OSX) { ... }
};
} else if (OSX) { void display_window_one() {
Widget w[] = { Widget w[] = {
new OSXButton(), factory.createButton(),
new OSXMenu() factory.createMenu()
}; };
} else if [...] w[0].paint();
w[0].paint(); w[1].paint();
w[1].paint(); }
}
28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 28
FactoryMethod
●
Can be used by the AbstractFactory to create new objects
● Replaces explicit new(...) with method
● Central element: static factory method in base class, e.g. static
BaseClass create();

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 29

FactoryMethod: Code example
Source (FU): http://www.vincehuston.org/dp/factory_method.html

class Stooge {
// Factory Method
public static Stooge create( int choice ) {
if (choice == 1) return new Larry();
else if (choice == 2) return new Moe();
else if (choice == 3) return new Curly();
else return null;
}
public String slap_stick() { return null; }
}

class Moe extends Stooge {

public String slap_stick() { return "slap head"; }
}

[...]

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 30

Prototype
●
Alternative way for AbstractFactory to create new objects
●
Central element: virtual clone method in subclasses, e.g.
BaseClass clone();
– Maintain pool of prototype objects
– Call clone() on appropriate prototype

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 31

Prototype: Code example
Source (FU): http://www.vincehuston.org/dp/prototype.html

interface Stooge {
public Stooge clone();
public String slap_stick();
}

class Factory {
private static Stooge s_prototypes[] = {
null, new Larry(), new Moe(), new Curly()
}
public static Stooge make_stooge( int choice ) {
return s_prototypes[choice].clone();
}
}

class Moe implements Stooge {

public Stooge clone() { return new Moe(); }
[...]
28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 32
Java Generics Recap
●
Template class:
public class pair<Type1, Type2> {
public Type1 first; public Type2 second;
public pair(Type1 t1, Type2 t2) { first = t1; second = t2; }
}

pair<String,String> translation = new pair<>("foo", "bar");

●
Template method:
public static <Type> pair<Type,Type> twice(Type v) {
return new pair<>(v,v);
}

pair<Int,Int> meaning_of_life = twice(new Int(42));

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 33

Outlook – Patterns, Part 2
●
Behavioural patterns, e.g. Iterator
●
Structural patterns, e.g. Adapter
●
UI patterns
●
Antipatterns

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 34

Questions/suggestions?
Image source (FU): http://www.vincehuston.org/dp/

The Periodic Table of Patterns

28/05/24 Software Engineering - © 2015 Dr. Florian Echtler, Bauhaus-Universität Weimar 35