Podcast
Videos
September 6, 2022
Nov 2022
6 Min

Softwarearchitektur bestehender Projekte leicht visualisieren

Schonmal den Überblick im eigenen Code verloren? Oder jemanden dafür verflucht, dass er seinen Code nicht verständlicher dokumentiert hat? Gerade wenn verschiedene Leute an einem Projekt zusammenarbeiten, ist Dokumentation etwas sehr Wichtiges. Aber nicht nur dann: Auch, wenn das Projekt sehr umfrangreich ist oder man nach längerer Zeit einen Bug fixen möchte, hilft es, sich in dem Projekt schnell (wieder) orientieren zu können. Und zwar auch den Entwicklern, die den Code geschrieben haben.

Klar, es gibt die Docs. Zum schnellen Einstieg empfiehlt es sich aber insbesondere, einen visuellen Überblick über die Softwarearchitektur des jeweiligen Projekts zu haben. Welche Klassen, Strukturen und Protokolle verwenden wir? Wie sind sie miteinander verknüpft? Was wir brauchen, ist ein Abhängigkeitsdiagramm des aktuellen Projektstatus.

Dafür gibt es mehrere großartige Tools, die ein Projekt als Grafiken oder Diagramme darstellen können:

  • Swift Relationship Graph 7
  • Swift Auto Diagramm 6

Leider weisen beide der genannten Programme Nachteile auf: Swift Relationship Graph 7 bietet keine interaktive Schnittstelle und zeigt nur die hierarchischen Beziehungen (Protokolle/Vererbung) an. Swift Auto Diagramm 6 ist sogar noch in der Beta-Phase und daher in einigen Projekten möglicherweise nicht oder nur eingeschränkt nutzbar. Somit brauchen wir ein anderes Tool, das diese Einschränkungen überwindet.

Objc Dependency Visualizer

Objc Dependency Visualizer ist eine Open-Source-Bibliothek von Paul Taykalo. Sie macht es möglich, schnell und einfach eine HTML-Seite mit interaktiven Grafiken zum aktuellen Projektstand zu erstellen.

So funktioniert's!

    Git-Repository klonen:
 $ git clone https://github.com/PaulTaykalo/objc-dependency-visualizer.git
    Erstellen unseres Zielprojekts in Xcode oder per Kommandozeile wie folgt:
 $ xcodebuild -project YOUR_PROJECT.xcodeproj
    Zum Ordner des Tools navigieren und Diagrammdefinitionen aus dem vorherigen Build generieren. Für weitere Befehle bitte in der Repo-Dokumentation nachschauen.
# swift project
 $ ./generate-objc-dependencies-to-json.rb -w -s "SWIFT_PROJECT_NAME" > origin.js

 # objective-c project
 $ ./generate-objc-dependencies-to-json.rb -d -s "OBJC_PROJECT_NAME" > origin.js
    Seite öffnen und genießen:
$ open index.html

Nachfolgend sind ein paar Beispiel-Screenshots von dem Alamofire-Projekt (Version 4.6.0). Der erste Screen gibt uns einen Überblick über den aktuellen Build des Projekts. Dank dieser umfassenden Darstellung können wir leicht erkennen, wie die einzelnen Elemente miteinander verbunden sind. Wir können auch mit dem Diagramm herumspielen, indem wir einen Knoten an eine beliebige Stelle auf der Seite ziehen oder für eine bessere Ansicht rein- oder rauszoomen.

Will man einen Knoten genauer betrachten reicht ein Doppelklick. Dadurch wird die Grafik herangezoomt und alle Knoten, wie in der folgenden Abbildung dargestellt, neu angeordnet. Sobald alle Knoten in Position sind, können alle damit verbundenen Abhängigkeiten leicht nachvollzogen werden.

Vorteile

Dieser Visualizer hat mehrere Vorteile gegenüber anderen Tools:

  • Unterstützung für in Objective-C und Swift geschriebenen Code
  • Kompakt und handlich
  • Einfache Installation
  • Keine zusätzlichen Frameworks oder Bibliotheken erforderlich
  • Umfangreiche und interaktive Benutzeroberfläche bzw Benutzungsoberfläche

Nachteile

Eine Reihe von Einschränkungen können als Nachteile angesehen werden:

  • Animation verlangsamt sich, wenn die Anzahl der Knoten wächst
  • Keine Abhängigkeitsrichtung auf niedrigem Niveau, sie werden stattdessen farbig dargestellt
  • Nicht geeignet für sehr große Projekte, da die Anzahl der Knoten und Kanten extrem hoch wird
  • Build eines Projektes muss manuell erfolgen

Fazit

Dieses Tool kann für alle Objective-C- und Swift-Entwickler sehr nützlich sein - es gibt einen visuellen Überblick über den aktuellen Stand des Projekts. Auch um dem Team die Architektur des Projekts zu erklären ist der Objc Dependency Visualizer ein sehr leistungsstarkes Instrument.

Andreas Link
Andreas Link
Anh Dung Pham
Anh Dung Pham
Cihat Gündüz
Cihat Gündüz
Andreas Link
Ekrem Sentürk
Eva Maria Stock
Eva-Marie Stock
Andreas Link
Giulia Maier
Inken Marei Kolthoff
Inken Marei Kolthoff
Janina Baumann
Janina Baumann
Janina Bokeloh
Janina Bokeloh
Jeanette Schmidt
Jeanette Schmidt
Jens Krug
Jens Krug
Kajorn Pathomkeerati
Kajorn Pathomkeerati
Karl Barth
Karl Barth
Kay Dollt
Kay Dollt
Murat Yilmaz
Murat Yilmaz
Thorsten Hack
Thorsten Hack
Thorsten Hack
Thorsten Hack
Inken Marei Kolthoff
Cynthia Murat
Inhaltsverzeichnis

Weitere Artikel

Passgenaue Backendabfragen mit GraphQL - Teil I
Ekrem Sentürk
26.11.2022
7 Min

Passgenaue Backendabfragen mit GraphQL - Teil I

Fast jeder App-Entwickler wurde bereits mit einer REST API konfrontiert, die zur Datenabfrage und -manipulation mehrere Endpunkte mit unterschiedlichen URLs zur Verfügung stellt.

Artikel lesen
Tutorial - iOS-Apps programmieren (1)
Cihat Gündüz
26.11.2022
2 Min

Tutorial - iOS-Apps programmieren (1)

Wäre es nicht toll, sich seine eigene App fürs iPhone zu programmieren?

Artikel lesen
Spritesheets für Android animieren
Inken Marei Kolthoff
26.11.2022
8 Min

Spritesheets für Android animieren

Vor Kurzem musste ich für ein Projekt einige Spritesheets animieren.

Artikel lesen

Jetzt kostenloses Strategiegespräch sichern!

Die Beratungen sind grundsätzlich schnell ausgebucht, deshalb fülle jetzt in 2 Minuten das kurze Formular aus.

Jetzt Strategiegespräch sichern