2015 - SUCKUP.de

[Update] Top Chrome Erweiterungen für Webdeveloper

Tipps zu Chrome:

in Chrome kann man verschiedene User anlegen, welche auch unterschiedliche Chrome-Erweiterungen installieren können (man kann z.B. einen Privacy-User anlegen): chrome://settings/
die DevTools sollte man kennen: https://speakerdeck.com/addyosmani/whats-new-in-chrome-devtools
Chrome-Extensions kann man auch ganz einfach selber erstellen:

Code: https://github.com/voku/Web-Analyse-Tools-for-Chrome

Demo: https://chrome.google.com/webstore/detail/web-development-analysis/ebhbpdaejpgndphbdcphdiefknmeciph

Beispiele: https://developer.chrome.com/extensions/samples)

Dev-Tools:

Name	Url	Info
Accessibility Developer Tools	Link	Barrierefreiheit von Webseiten Testen via Chrome-Dev-Tools
Blackfire Companion	Link	PHP: Better app performance with a low-overhead Profiler
Caspr: Enforcer	Link	Content Security Policy (CSP) Änderungen prüfen und testen
Codecov Extension	Link	Code-Coverage Report-Overlay innerhalb von Github und Bitbucket
Ember Inspector	Link	Debugging für Ember-Anwendungen
GitHub Linker	Link	Verlinkte Packages via npm, bower, composer etc.
GitHub Mate	Link	Extra Features für github.com z.B. Download-Button
HTML5 Outliner	Link	Zeigt eine Übersicht über alle Inhalte einer Webseite an, wenn HTML korrekt ver
HTTP/2 and SPDY indicator	Link	Zeigt in der Adresszeile an, ob HTTP/2 verwendet wird
JetBrains IDE Support	Link	HTML/CSS/JavaScript editing and JavaScript debugging using JetBrains IDEs
JetBrains Toolbox Extension	Link	Adds link to open project from GitHub in JetBrains IDEs
JSON Editor	Link	JSON Editor, welcher sowohl einen Daten-Tree in JSON also auch JSON in einen Daten-Tree konvertieren kann
JSONView	Link	Validiert und zeigt JSON an
LiveReload	Link	CSS kann ohne Browser-Reload aktualisiert werden (siehe z.B. grunt-contrib-watch)
Lovely forks	Link	Zeigt Forks auf github.com Seiten an
Octotree	Link	Zeigt GitHub-Code in einer Baumstruktur dar
SelectorGadget	Link	CSS (xPath) Elemente auf Webseiten per Maus auswählen
Web Developer Checklist	Link	Schnelle Check-Liste für Webseiten (Favicon, robots.txt, …)
WAVE Evaluation Tool	Link	Barrierefreiheit-Overlay für Webseiten

Privacy-Tools:

Name	Url	Info
AdBlock	Link	Entfernt Werbung von Webseiten …
Deaktivierungs-Add-on von Google Analytics	Link	Weist das JavaScript (ga.js) von Google Analytics an, keine Informationen an Google Analytics zu übermitteln
Disconnect	Link	Ein weites Privacy-Tool …
HTTPS Everywhere	Link	Sichern Sie Ihre Internetverbindung! Automatische HTTPS-Sicherheit auf vielen Webseiten
uBlock	Link	Ein effizienter Blocker …
uMatrix	Link	Kontrolliere alle Anfragen deines Browsers …

Organisation- / Extra-Tools:

Name	Url	Info
Boards for Trello	Link	Schnellzugriff auf trello.com
Der Camelizer	Link	Einfaches Anzeigen historischen Preisdaten direkt in Amazon
feedly	Link	Ein sehr guter RSS-Reader
Google Cast	Link	Senden Sie Inhalte an Ihren Chromecast und andere Geräte, die Google Cast unterstützen.
Lazarus: Form Recovery	Link	Speichert alle Daten von Formularen ab, so dass diese Informationen nicht verloren gehen
SimpleExtManager	Link	Eine schnelle Verwaltung für Chrome-Erweiterungen
Tabs Outliner	Link	Session- und Tab-Manager für Chrome
OneTab	Link	Tabs in einer Liste zusammenfassen, um Speicher zu sparen
Save to Pocket	Link	Speicher Artikeln, Videos und mehr …
Web Timer	Link	Zeigt an wie viel Zeit man auf den jeweiligen Webseiten verbringt

HTTP/2 ist angekommen | Apache 2.4.17

Was ist HTTP/2? Diese Frage haben andere bereits ausführlich geklärt. https://http2.github.io/faq/ :) daher wollen wir dies heute in Kombination mit dem Apache Webserver ausprobieren.

Im Februar 2015 hat Google den Support für SPDY bereits zugunsten von HTTP/2 eingestellt. Und die Kompatibilität von HTTP/2 ist in fast allen aktuellen Webbrowsern gegeben, so das es bereits seit einiger Zeit keinen Grund gibt, nicht auf das neue Protokoll zu setzen. Seit dieser Woche unterstützt auch der Apache Webserver (2.4.17) das Protokoll, “Stefan Eissing” hat das Module “mod_http2” gesponsert, welches wir im folgenden testen werden.

Installation unter Ubuntu 14.04 via Fremdquellen (PPA)

Warnung: “Zusätzliche Fremdquellen können das System gefährden.”
–> https://wiki.ubuntuusers.de/paketquellen_freischalten/ppa

Zu beginn stellen wir sicher, dass SPDY nicht mehr verwendet wird.

a2dismod spdy

Und deinstallieren dies am besten direkt, falls dies über den Paket-Manager installiert wurde.

apt-get purge mod-spdy-beta

service apache2 restart

Um die Quellen (/etc/apt/sources.list.d/) nicht manuell zu ändern, installieren wir kurzerhand das Programm “add-apt-repository” via:

aptitude install software-properties-common

# Web: https://launchpad.net/~ondrej/+archive/ubuntu/apache2
# Issues: https://github.com/oerdnj/deb.sury.org/issues
#
add-apt-repository ppa:ondrej/apache2

Falls es beim Hinzufügen des Keys zu Problem kommt, kann man dies auch manuell durchführen:

apt-key adv –keyserver keyserver.ubuntu.com –recv-keys 4F4EA0AAE5267A6C

Anschließend installieren wir das Update via “aptitude“, sodass wir mehr Kontrolle über den Update-Prozess haben.

apt-get update; aptitude

Nach der Installation können wir das “http2”-Module wie folgt aktivieren.

cd /etc/apache2/mods-available/

vim http2.load

# Depends: setenvif mime socache_shmcb
LoadModule http2_module /usr/lib/apache2/modules/mod_http2.so

vim http2.conf

<IfModule http2_module>
ProtocolsHonorOrder On
Protocols h2 h2c http/1.1
</IfModule>

# vim: syntax=apache ts=4 sw=4 sts=4 sr noet

Und anschließend muss das Module nur noch aktiviert werden:

a2enmod http2

service apache2 restart

Um zu testen, ob HTTP/2 via https genutzt wird, können wir z.B. direkt im Chrome nachschauen. Dafür öffnen wir einfach die Seite chrome://net-internals und nutzen oben links im DropDown-Menü den Punkt “HTTP/2”.

Quellen:

Apache + HTTP/2: http://www.us.apache.org/dist//httpd/CHANGES_2.4.17
Nginx + HTTP/2: http://mailman.nginx.org/pipermail/nginx-devel/2015-September/007328.html
HowTo: https://icing.github.io/mod_h2/howto.html
Repo: https://launchpad.net/~ondrej/+archive/ubuntu/apache2
Präsentation: http://slidedeck.io/Schepp/HTTP-2
Demo: https://http2.akamai.com/demo

Mr. Robot | Staffel 1, Folge 1 in a nutshell

Die Fernsehserie folgt einem jungen Programmierer (Elliot), der von dem mysteriösen Mr. Robot für eine Hackergruppe rekrutiert wird und wer die Serie bisher noch nicht geschaut hat, sollte dies nachholen.

In Folge 1 muss Elliot einen Rootkit ausfindig machen, viel mehr werde ich an dieser Stelle nicht vorwegnehmen. Viele der folgenden Befehle sind nicht ohne weiteres auf jedem Linux System auszuführen oder es gibt diese gar nicht. Jedoch versteht bzw. sieht man was diese bewirken sollen.

1. Status

Um das Problem vom Büro aus zu analysieren, werden zunächst Netzwerk und Dienste geprüft.

status -scanports -s WBUSl12345678WB1 -p[80-7655]

Hier hat Elliot sich anscheinend eine Shell-Funktion geschrieben, welche einen Portscan auf der Server “WBUSl12345678WB1” mit der Port-Range 80 bis 7655 durchführt.

Der folgender Befehl würde wirklich funktionieren.

nmap WBUSl12345678WB1 -p80-7655

Als nächstes wird anscheinend geprüft welche Prozesse momentan auf dem Remote-Server ausgeführt werden.

status -services -s WBUSl12345678WB1

Dies könnte auch eine selbst programmiere Shell-Funktion sein, welche sich auf dem Remote-Server einloggt und die Prozesse z.B. via “ps aux” auflistet.

ssh user@WBUSl12345678WB1 ‘ps aux’

Resultat: Die Services sind nicht mehr erreichbar und anscheinend läuft auf dem Server ein Xorg. ;) Da der Fehler nicht einzugrenzen ist, wird Elliot (mit dem Jet) zum Rechenzentrum geflogen, um den infizierten Server zu lokalisieren und zu isolieren. *freu*

2. Ping

Der Befehl selbst ist in der Sequenz nicht zu sehen aber dies könnte so ähnlich aussehen.

fping -g 194.122.82.0/24

Resultat: Ein Server ist noch aktiv, dies muss der Übeltäter sein …

3. Locate WBKUW300PS345672

Der gehackte Server soll in der nächsten Szene manuell durch den Backup-Server ersetzt werden. Es wird der Befehl “Locate” ausgeführt, um sich zunächst an dem gehacktem Server anzumelden.

Der “locate” Befehl ist eigentlich zum suchen von Dateien gedacht, aber diese wird ja auch klein geschrieben.

4. astsu

Hier wird außerdem der fiktive Befehl “astsu” ausgeführt, um Informationen vom Netzwerk-Informationen vom Server zu erhalten.

Folgende Befehle funktionieren tatsächlich…

DNS:

cat /etc/resolv.conf

IP:

ifconfig

ROUTING:

route

In der nächsten Szene sehen wir sowohl die vorherigen aus auch die nächsten Befehle welche auf der Konsole eingegeben wurden.

astsu -close port: * -persistent

Und wie wir sehen übernimmt der Befehl “astsu” auch noch die Funktionalität von “iptables“. ;)

Locate BKUW300PS345672

Hier kommt nocheinmal der “Locate” Befehl zum Einsatz, um sich auf den Backup-Server einzuloggen.

set waneth0* : * 23.234.45.1 255.255.255.0 [45.85.123.10; 45.85.124.10; 45.85.125.10]

Im Output kann man ein “false” sehen, aber Elliot verwendet “-force” um dieses Problem zu lösen. Natürlich ist auch diese Befehl ausgedacht, aber viele andere Linux Kommandos akzepieren ebenfalls einen “–force” Parameter, daher ist dies gar nicht so abwegig.

set -force -ovr02 waneth04 : 23.234.45.62:441 23.234.45.1 255.255.255.0 [45.85.123.10; 45.85.124.10;

Um die IP-Adresse wirklich zu konfigurieren kann man z.B. “ifconfig & route” oder “ip” verwenden.

ip addr add 45.85.123.10/24 dev eth0

ip addr add 45.85.124.10/24 dev eth0

ip addr add 45.85.125.10/24 dev eth0

ip route add default via 23.234.45.1

Resultat: Der gehacket Server ist offline und der Backup-Server hat dessen Funktion übernommen.

5. ps aux | grep root

ps aux | grep root

Nachdem die Gefahr gebannt ist, schau Elliot sich den gehackten Server noch einmal genauer an und findet einen Prozess (pid: 24) welcher mit höchster Priorität (-20) läuft.

astu trace -pid 244 -cmd

Hier tauch eine abgewandelte Version vom fiktiven Befehl “astsu” auf, warum die pid 244 und nicht die 24 weiter untersucht wird, bleibt ungeklärt.

Um einen Prozess tatsächlich näher zu untersuch, würde ich zunächst folgende Befehle nutzen.

strace -p 24

lsof -p 24

Beispiel für “strace” & “lsof”

6. ps aux | grep root | cpuset

ps aux| grep root | cpuset

“cpuset” würde hier nicht funktionieren und ich bin mir nicht ganz sicher was “cpuset” überhaupt macht?!

astu -ls ./root/fsociety/ -a

Nun wird der Inhalt vom Verzeichnis “/root/fsociety/” angezeigt, folgender Befehl würde funktionieren.

ls -la /root/fsociety/

Elliot schau sich nun die README Datei der Hacker an und möchte den Rootkit zunächst im folgenden löschen.

more readme.txt

astu -rm -norecycle /root/ fsociety/

Um das Verzeichnis wirklich zu löschen, müsste der folgende Befehl ausgeführt werden.

rm -rf /root/fsociety/

Aber er entscheidet sich dagegen und ändert stattdessen die Berechtigungen der Datei, so dass nur noch er selber Zugriff darauf hat.

chmod -R ER280652 600

Auch dieser Befehl wird so nicht funktionieren, da man “chmod” und “chown” unterscheidet. Folgende Befehle würden funktionieren.

chmod -R 600 /root/fsociety/

chown -R ER280652 /root/fsociety/

Resultat: Der ursprüngliche Server ist offline, der Backup-Server ist online und der Rootkit ist noch immer im System.

Fazit: echo “Ich mag diese Serie.” | sed ‘s/Serie/Nerd-Serie/’

jQuery Performance

Demos: http://jsperf.com/jquery-performance-2015

Die folgenden Tipps erklären wie man die Performance von jQuery verbessern kann, einfach indem man das Framework korrekt einsetzt und bei kritischem Code auf JavaScript zurückgreift.

– verwende “gute” Selektoren
– verwende Variablen als Cache
– verwende “chaining” -> .function1().function2()…
– vermeide Dom Interaktionen

jQuery-Selektor Performance

Sehr Schnell: $(“#id”) || $(#id).find(“.class”)
Schnell: $(“tag.class”)
Normal: $(“.class”) || $(“.class”).children()
Langsam: $(“tag”)
Langsamer: $(“tag1 tag2”) || $(“.class tag:type”)
Extrem Langsam: $(“.class > *”) || $(“.class :type”)

Daraus ergibt sich z.B. das eine Kombination aus “.class #id” langsamer ist, als ein einfacher “#id”-Selektor. Deshalb ist es bei jQuery auch schneller einen bestimmten Bereich im Dom via “#id”-Selektor zu laden und anschließend in der entsprechenden Variable nach weitern HTML-Fragmenten zu suchen. -> .find()

Zudem sollte man bei Selektoren bedenken, dass rechts immer der spezifischste Ausdruck stehen sollte. Gegebenenfalls benötigt man jedoch gar keine lange Selektoren, wenn man Zugriff auf das entsprechende HTML hat, um dieses zu ändern.

// Unoptimiert:
$(“tag1.class1 .class2”)

// Optimiert:
$(“.class1 td2.class2”)

Demo (#id vs .class):
http://jsperf.com/cached-jquery-selector-2015-v2/2

Demo (jQuery – find):
http://jsperf.com/cached-jquery-selector-2015-v3

Demo (jQuery – find vs jQuery Plugin):
http://jsperf.com/cached-jquery-selector-vs-jquery-plugin

Demo (jQuery – simple vs jQuery Plugin):
http://jsperf.com/jquery-simple-vs-jquery-plugin

Demo (Zepto.js vs jQuery):
http://jsperf.com/cached-jquery-selector-vs-zepto-selector-v2/5

Demo (Zepto.js vs jQuery vs Sprint.js vs JavaScript):
http://jsperf.com/zepto-vs-jquery-2013/103

Demo (Sprint.js vs jQuery):
http://jsperf.com/cached-jquery-selector-vs-sprintjs-selector

Demo (JavaScript vs jQuery):
http://jsperf.com/cached-jquery-selector-vs-javascript

IMMER Variablen als Cache verwenden

Um auf bestimmte HTML-Fragmente im Dom zuzugreifen ist es aus Performance-Sicht hilfreich, wenn man sich einen Teil vom Dom in einer Variable speichert und anschließend nur noch innerhalb von JavaScript arbeitet. z.B.:

// Sehr langsam (& Sinnfrei):
$('.myElement span').each(function(i) {
  $('.myElement span').eq(i).css('color', 'green');
});

// Langsam:
$('.myElement span').each(function() {
  $(this).css('color', 'green');
});

// Langsam:
$('.myElement span').css('color', 'green');

// Schneller:
$('#myElement').find('span').css('color', 'green');

// Noch schneller: (jQuery + JavaScript)
myElement = $('#myElement').find('span');
for (var i = 0, len = myElement.length; i < len; i++) {
  myElement[i].style.color = 'green';
}

// Sehr schnell: (kein jQuery)
myElement = document.querySelector('.myElement');
myElement = myElement.querySelectorAll('span');
for (var i = 0, len = myElement.length; i < len; i++) {
  myElement[i].style.color = 'green';
}

// Sehr sehr schnell: (kein jQuery)
myElement = document.getElementById('myElement');
myElement = myElement.getElementsByTagName('span');
for (var i = 0, len = myElement.length; i < len; i++) {
  myElement[i].style.color = 'green';
}

Demo (mit / ohne Cache-Variable):
http://jsperf.com/cached-jquery-selector-2015-v2

Zusammenfassung:

jQuery ist im Vergleich mit JavaScript oder anderen Frameworks langsamer, aber wenn man z.B. noch den IE8 unterstützen muss, sollte man auf ein umfassendes Framework wie jQuery nicht verzichten, da ansonsten die entgütige Entwicklungszeit (z.B. Bugfixes für IE) die bessere Performance nicht rechtfertigt. Ein weitere Pluspunkt für jQuery sind die viele bereits fertigen jQuery-Plugins. Außerdem kann man die Performance von jQuery verbessern, wenn man beim programmieren von jQuery-Plugins darauf achtet so wenig Dom-Selektoren “$()” bzw. Dom-Interaktionen wie möglich zu nutzen.

Um dies zu bewerkstelligen kann man z.B. auf das jQuery Boilerplate zurückgreifen, so dass man bereits eine erste Programmier-Struktur vorgegeben hat. Dies hat zusätzlich den Vorteil, dass die eigenen Plugins, die jQuery typische Verkettung von Befehlen unterstützen. Außerdem gewöhnt man sich somit daran in Modulen / Plugins zu denken, welche man zudem durch dessen Konfiguration auch wiederverwenden kann.

Zepto.js war bei meinen Tests keine Alternative zu jQuery, da z.B. ein each() kein zepto-object zurückgibt, so dass man innerhalb der Schleife wieder einen Selektor benötigt. Das Framework nutz die Syntax und Namen wie jQuery, verhält sich jedoch leider etwas anders.

Sprint.js war in den Tests bei weitem schneller als jQuery, jedoch unterstützt dieses Framework nur IE 10+, außerdem ist dieses Framework nicht mal ein Jahr alt, die Dokumentation ist noch nicht vorhanden (bzw. verweist auf die jQuery Dokumentation) und es wurde noch nicht von so vielen Entwicklern getestet wie z.B. jQuery.

Links:

– Erklärung zu jQuery- bzw. CSS-Selektoren: http://suckup.de/howto/jquery/crashkurs-jquery-selektoren/
– Effektive CSS-Selektoren: https://css-tricks.com/efficiently-rendering-css/
– jQuery Performance (Tizen): https://developer.tizen.org/dev-guide/2.3.0/org.tizen.guides/html/web/w3c/perf_opt/jquery_performance_improvement_w.htm
– jQuery Performance (jQuery): http://learn.jquery.com/performance/optimize-selectors/
– jQuery Performance (Blog-Post): http://blog.dareboost.com/en/2014/04/jquery-performance-optimization/

Guideline für Open Source Software

SLIDES

Was ist Open Source Software?
Wo veröffentliche ich Open Source Software?
Welche Open Source Software Standards gibt es?
1. Lizenz
2. Quellcode-Organisatzion
3. Dokumentation
4. Kommunikation
5. Versionsnummern
6. Abhängigkeitsmanagement
7. Testabdeckung
8. Issue-Tracking-System
Wie veröffentliche ich Open Source Software?
1. Beispiel: npm
2. Beispiel: bower
3. Beispiel: composer
Beispiel-Repository

1. Was ist Open Source Software?

Freiheit 0: Das Programm zu jedem Zweck auszuführen.

Freiheit 1: Das Programm zu untersuchen und zu verändern.

Freiheit 2: Das Programm zu verbreiten.

Freiheit 3: Das Programm zu verbessern und diese Verbesserungen zu verbreiten, um damit einen Nutzen für die Gemeinschaft zu erzeugen.

1.1 Geschichte

1893: AT&T wird gegründet

1911: IBM wird gegründet

1969: AT&T beginnt mit der Entwicklung eines quelloffenes Betriebssystem – Unix

1972: Dennis Ritchie veröffentlciht die Programmiersprache – C

1975: Microsoft wird von Bill Gates und Paul Allen gegründet

1976: Apple wird von Steve Jobs, Steve Wozniak und Ron Wayne gegründet

1977: Universität von Kalifornien in Berkeley entwickelt einen Fork von Unix – BSD

1980: Unix wird proprietär

1981: 86-DOS wird von Microsoft gekauft und an IBM verkauft ~ MS-DOS

1984: Richard Stallman beginnt mit der Entwicklung eines freien Betriebssystems – GNU

1985: Richard Stallman gründet eine gemeinnützliche Organisation – Free Software Foundation

1985: NeXT wird von Steve Jobs gegründet

1987: IBM und Microsoft veröffentlichen ein proprietäres Betriebssystem – OS/2

1987: Andrew S. Tanenbaum Minix veröffentlichen ein freies Betriebssystem – Minix

1988: MIT-Lizenz wird veröffentlicht

1988: NeXT, Inc. veröffentlicht ein proprietäres Betriebssystem, ein Fork von BSD – NeXTStep

1989: Richard Stallman schreibt eine Lizenz für Freie Software: GNU General Public License

1991: Linus Torvalds entwickelt einen freien Kernel – Linux

1993: Ian Murdock beginnt mit der Entwicklung eines freien Betriebssystems – Debian (GNU/Linux)

1993: Open-Source-Community veröffentlicht ein freies unixoides Betriebssystem – FreeBSD 1.0

1993: Microsoft veröffentlicht ein proprietäres Betriebssystem – Microsoft_Windows_3.1

1995: Rasmus Lerdorf entwickelt eine Skriptsprache für Webanwendungen – PHP

1995: Sun Microsystems entwickelt eine objektorientierte Programmiersprache – Java

1995: Netscape entwickelt eine Skriptsprache für Client-Webanwendungen – JavaScript

1996: erste Version des Betriebssystems Debian wird veröffentlicht – Debian 1.1 (GNU/Linux)

1998: Goolge wird von Larry Page und Sergey Brin gegründet – Google

1998: Organisation, zur Förderung von Open-Source-Software wird gegründet – OSI

2000: Apple veröffentlicht ein freies unixoides Betriebssystem, einen Fork von NeXTStep (FreeBSD) – Darwin

2001: Microsoft veröffentlicht ein proprietäres Betriebssystem – Microsoft Windows XP

2001: ein freies Onlinelexikon geht online – Wikipedia

2001: gemeinnützliche Organisation für freie Software (Europa) wird gegründet – FSFE

2001: gemeinnützliche Organisation für freie Lizenzen wird gegründente – Creative Commons

2002: freie Software wird im deutschen Urhebergesetz rechtskräftig – Linux-Klausel

2003: ein freie Software zur Verwaltung von Websiten wird veröffentlicht – WordPress

2005: Linux Torvalds beginnt mit der Entwicklung einer freien Versionsverwaltung – git

2008: Google Chrome (freeware) / Chromium (free) wird veröffentlicht – Chrom[e|ium]

2008: Google veröffentlicht ein freies Betriebssystem – Android

2009: Joyent Inc. entwickelt freie serverseitige Plattform für Netzwerkanwendungen – NodeJS

2012: Microsoft veröffentlicht ein proprietäres Betriebssystem – Microsoft Windows 8

2013: Mozilla veröffentlicht ein freies Betriebssystem – Firefox OS

2014: Open-Source-Community veröffentlicht ein freies unixoides Betriebssystem – FreeBSD 10 .0

2015: Linus Torvalds veröffentlicht eine neue Version seines freien Kernels – Linux 4.0

…

Umsatz: Um zu verdeutlichen, wie viel Geld mit Software (Computer) verdient werden kann, auch mit Open Source Software …

Apple: 182,8 Mrd. USD (2014)
AT&T: 128,8 Mrd. USD (2013)
IBM: 92,8 Mrd. USD (2014)
Microsoft: 85,8 Mrd. USD (2014)
Google: 66 Mrd. USD (2014)
Red Hat: 1,33 Mrd. USD (2013)
Mozilla: 0,3 Mrd. USD (2013)
Canonical (Ubuntu): 0,065 Mrd. USD (2014)

1.2 Freie Software ⊆ Open Source Software

Man kann “Freie Software” als Teilmenge von “Open Source Software” verstehen, wobei der Begriff “Open Source” erst später eingeführt wurde, da man freie Software als geschäftsfreundlich und weniger ideologisch belastet darstellen wollte. Außerdem wollte man dem Begriffsproblem von „free software“ entgegenwirken, denn auch wenn viele freie Software kostenlos (free) ist, ist dies keine “freeware”.

Für die Definition von freier Software findet man folgenden Satz auf der GNU/GPL Webseite: To understand the concept, you should think of “free” as in “free speech,” not as in “free beer”.

Freie Software gewährt demnach dem Nutzer Freiheiten, was bei proprietärer Software nicht der Fall ist: z.B.:

https://govtrequests.facebook.com/: Hier kann man nachlesen, wie viele Anfragen die entsprechenden Regierungen an Facebook gestellt haben, um an unsere Informationen zu kommen oder uns bestimmte Informationen vorzuenthalten.

http://www.heise.de/newsticker/meldung/Amazon-loescht-gekaufte-Kindle-eBooks-6887.html: Hier hat Amazon Kindle-eBooks (“1984” und “Animal Farm” von George Orwell) von extern gelöscht, da der Verkäufer die nötigen Rechte zum verkaufen gar nicht besaß.

http://blogs.technet.com/b/mmpc/archive/2014/01/09/tackling-the-sefnit-botnet-tor-hazard.aspx: Hier wurde ebenfalls Software von extern gelöscht – Microsoft löscht Tor-Software nach Trojaner-Befall.

1.3 Lizenzen

Es gibt es mittlerweile (zu) viele verschiedene Open Source Lizenzen und Lizenz-Versionen, welche teilweise nicht einmal miteinander kompatibel sind, so z.B. bei GPLv2 und GPLv3 welche man nicht gemeinsam in einem Programm nutzen darf: https://www.gnu.org/philosophy/license-list.html

Allgemein kann man die verschiedenen Open Source Lizenzen jedoch in folgende Kategorien einteilen: Copyleft / Copyright

Copyleft ist eine Form von freier Software, bei der die Freiheit des Endanwenders hervorgehoben wird und die Freiheit der Programmierer hinten anstellt, so kann (darf) man z.B. “Google APIs Client Library for PHP” nicht für WordPress-Plugins verwenden, da diese Bibliothek nicht mit GPL kompatibel ist.

Art des Copyleft	Starkes Copyleft	Schwaches Copyleft	kein Copyleft
Kombinationsmöglichkeit mit proprietärer Software	keine Einbindung in proprietären Code möglich	statisches und dynamisches Linken von Code mit proprietärer Software möglich. Eigen-Entwicklungen dürfen als proprietäre Software weitergegeben werden	darf auch in proprietäre Software verwendet werden
Beispiel-Lizenz	GPL	LGPL, MPL	BSD, Apache, MIT

1.4 Geschäftsmodelle

Beispiele:

– Adobe Systems veröffentlicht Flex (Apache License 2.0) und verkauft die Flash Builder IDE.
– Apple Inc. veröffentlicht Darwin (Apple Public Source License) und verkauft Mac OS X.
– Asterisk (PBX), verkauft Hardware auf welcher Open Source Software (GPL) läuft.
– Codeweavers verkauft CrossOver (proprietär + LGPL) und nutzt dafür als Grundlage Wine (LGPL)
– Canonical Ltd. bietet Ubuntu als Open Source an und bietet technischen Support gegen Zahlung an.
– Mozilla Foundation lässt sich von Google, Yahoo und anderen Unternehmen bezahlen, um z.B. die entsprechende Suchmaschine in Mozilla Firefox zu integrieren.
– Oracle bietet MySQL als Open Source Version (GPL) und als Enterprise Version (proprietär) mit Support und zusätzlichen Features an.

2. Wo veröffentliche ich Open Source Software?

Allein durch die Veröffentlichung von Quellcode entsteht zur noch keine Open Source Software, aber es bleibt die Grundvoraussetzung. Mittlerweile gibt es viele Plattformen, welche sich auf Quellcode-Repositories spezialisiert haben, dabei hat man sich inoffiziell bereits darauf geeinigt, dass “github.com” als Standard für Open Source Software angesehen wird. Sowohl npm, composer als auch bower nutzen github.com als Standard-Repository.

3. Welche Open Source Software Standards gibt es?

Unix ist der Ursprung von Open Source und die Unix-Philosophie von ~1970 lässt sich noch immer auf heutige Software Projekte anwenden: „Mache nur eine Sache und mache sie gut.“

– Schreibe Computerprogramme so, dass sie nur eine Aufgabe erledigen und diese gut machen. (Packages?)
– Schreibe Programme so, dass sie zusammenarbeiten. (REST?)
– Schreibe Programme so, dass sie Textströme verarbeiten, denn das ist eine universelle Schnittstelle. (JSON?)

Es gibt viele inoffizelle Standards bei Open Source Projekten, welche ggf. jedoch auch erst von der Community erstellt oder / und überhaupt erst im laufe des Projektes erstellt werden.

3.1 Open Source Lizenz für Software angeben (z.B.: LICENSE.txt)
– kann man verwenden: GPL, LGPL, MIT, BSD3
– sollte man ggf. vermeiden: Creative Commons, Beerware, WTFPL
– CLA (Contributor License Agreement) beachten: z.B.: Zend Framework 1

3.2 Quellcode Organisatzion (z.B. “src/”, “tests/”, “lib/”)
– Wie heißt das Verzeichnis für Tests?
– Wo findet man die Abhänigkeiten (vendor)?
– Wo findet man den Quellcode?

3.3 Dokumentation für Entwickler und Anwender
– Beschreibung, Code-Beispiele, Testabdeckung, Version, Lizenz, … (z.B.: README.md)
– Wie man mithelfen kann (z.B.: CONTRIBUTING.md)
– Anwender-Dokumentation (nicht im Code-Repository), z.B.:
– Beschreibung mit Beispielen / Bildern / Demos
– Wie man Bugs melden sollte (yourbugreportsucks.com / Beispiel)
– Entwickler-Dokumentation (nicht im Code-Repository), z.B.:
– Wie man den Quelltext herunterlädt
– Wie ist die Verzeichnis-Strucktur des Projektes
– Wie installiert man das Build-System / Wie nutzt man das Build-System
– Wie führt man die entsprechenden Tests aus
– Wie sieht der Code-Style aus (z.B.: google-styleguide)

3.4 Plattform für Fragen und Kommunikation, z.B.:
– Mailingliste / Forum
– Stack Overflow
– gitter.im
– groups.google.com

3.5 Versionsnummern korrekt verwenden
– Semantic Versioning via MAJOR.MINOR.PATCH
– MAJOR: Hauptversion, wenn die API geändert wird
– MINOR: neue Funktionen, welche keine API-Änderungen hervorrufen
– PATCH: bei abwärtskompatibelen Bugfixes
– Tag-Versionen in der Quellcodeverwaltung nutzen (z.B. git tag)
– ggf. einen Changelog schreiben (z.B.: CHANGELOG.md)
– Abhängigkeiten definieren (z.B.: package-versions with composer)

3.6 Abhängigkeitsmanagement für verwendete Bibliotheken nutzen, z.B.:
– PHP: Composer (packagist.org)
– JS / Node.JS: npm
– HTML / CSS / JS: bower

3.7 Testabdeckung und automatische Tests bei jeder Änderung
– Unit-Tests / BDD / TDD, z.B.:
– PHP: PHPUnit / phpspec
– JavaScript: mocha, Jasmine, qUnit …
– Frontend-Testing, z.B.:
– CasperJS / DalekJS / Selenium
– automatisierte Tests
– Travis CI (Linux)
– AppVeyor (Windows)

3.8 Issue-Tracking-System zur Verwaltung von Bugs verwenden
– z.B.: github – Issue-Tracking aktivieren
– Übersicht über Fehler und wer diese fixed
– “Gruppenzwang”, da das Issue-Tracking für jeden einsehbar ist

3.9 Contributor-Model bei größeren Projekten, z.B.: yui3

4. Wie veröffentliche ich Open Source Software?

4.2 Beispiel: npm

# Installation von node.js, z.B.:
sudo apt-get install nodejs

# Konfiguriere npm
npm set init.author.name "Lars Moelleken"
npm set init.author.email "lars@moelleken.org"
npm set init.author.url "http://moelleken.org"

# npm User erstellen (~/.npmrc)
npm adduser

# interaktiv eine “package.json”-Datei erstellen
npm init

# Abhänigkeiten & Tests hinzufügen
npm install mocha --save-dev
npm install chai --save-dev

# Veröffentliche dein Paket
npm publish

4.2 Beispiel: bower

# Installation von node.js, z.B.:
sudo apt-get install nodejs

# Installation von bower
npm install -g bower

# interaktiv eine “bower.json”-Datei erstellen
bower init

# Veröffentliche dein Paket
bower register <my-package-name> <git-endpoint>

4.3 Beispiel: composer

# Installation von composer, z.B.:
curl -sS https://getcomposer.org/installer | php

# interaktiv eine “composer.json”-Datei erstellen
composer init

# Veröffentliche dein Paket
https://packagist.org/packages/submit

5. Beispiel-Repositories

https://github.com/voku/node-lettering

https://github.com/voku/bower-lettering

Quellen / Links:

– eine Liste von offiziellen “Open Source” Lizenzen: http://opensource.org/licenses/alphabetical

– eine Liste von Programmiersprachen und deren Lizenzen: http://en.wikipedia.org/wiki/List_of_open-source_programming_languages

– Gespräch: Unterstützen von Open Source Projekten: https://www.radiotux.de/index.php?/archives/7995-RadioTux-Sendung-Maerz-2015.html

– Support for Open-Source Software: https://www.bountysource.com/

– Easy Pick (einfach zu behebende Bugs) -> z.B.: https://github.com/symfony/symfony/issues?q=is%3Aopen+is%3Aissue+label%3A%22Easy+Pick%22

– Help your favorite open source projects: http://www.codetriage.com/

– Statistik über freie Lizenzen auf github: http://ostatic.com/blog/the-top-licenses-on-github

– Erklärung zu freie Lizenzen: http://www.webmasterpro.de/management/article/freie-lizenzen.html

– A Beginner’s Guide to Creating a README: https://thechangelog.com/a-beginners-guide-to-creating-a-readme/

– Starting An Open-Source Project: http://www.smashingmagazine.com/2013/01/03/starting-an-open-source-project/

– qUnit vs Jasmine vs Mocha: http://www.techtalkdc.com/which-javascript-test-library-should-you-use-qunit-vs-jasmine-vs-mocha/

– Which programming language has the best package manager?http://blog.versioneye.com/2014/01/15/which-programming-language-has-the-best-package-manager/

– Erstelle Packages via bower: http://bower.io/docs/creating-packages/

– Open-Source-Lizenzen: http://www.heise.de/open/artikel/Open-Source-Lizenzen-224724.html

– Think about the license! http://lucumr.pocoo.org/2009/2/12/are-you-sure-you-want-to-use-gpl/

– Linus Torvalds says GPL v3 violates everything that GPLv2 stood for: https://www.youtube.com/watch?v=PaKIZ7gJlRU

– GNU – Free Software: https://www.gnu.org/philosophy/free-sw.en.html

– GNU/GPL: https://www.gnu.org/copyleft/gpl.html

– GNU/Packages: http://www.gnu.org/manual/blurbs

– FreeBSD über Vor- und Nachteile von GPL: https://www.freebsd.org/doc/en_US.ISO8859-1/articles/bsdl-gpl/gpl-advantages.html

– Geschäftsmodelle für Open-Source: http://t3n.de/magazin/geschaftsmodelle-open-source-unternehmer-welche-ansatze-221154/

– Open-Source-Finanzierung (Podcast): http://chaosradio.ccc.de/cr209.html

Admin meets Frontend

… oder was „JavaScript“ und „Shell-Script“ gemeinsam haben.

Zu beginn muss ich zugeben, dass ich bei meinen ersten Skripten auch nicht auf den Sichtbarkeitsbereich von Variablen (Scope) geachtet habe. Wenn man sich jedoch etwas mit Softwareentwicklung auseinandersetze stellt man schnell fest, dass globale Variablen direkt aus der Hölle kommen und nichts im Quelltext zu suchen haben.

Variablen sind zumindest in der Shell und in JavaScript zunächst global, selbst innerhalb von Funktionen und werden erst durch den Zusatz „var“ bzw. „local“ zur lokalen Variable. In vielen anderen Programmiersprachen erkennt man den Scope einer Variable direkt im Zusammenhang, ist z.B. eine Variable innerhalb einer Methode deklariert, so ist diese nur innerhalb dieser Methode verfügbar. Wird die Variable jedoch innerhalb der Klasse deklariert, so ist diese für die ganze Klasse und somit für alle Ihre Methoden verfügbar.

Es folgen ein paar Beispiele, wo der Inhalt (Title der Beiträge) des RSS-Feeds von “planet.ubuntuusers.de” ausgegeben werden soll.

JS-Beispiel: mit globalen Variablen

Um dies selber zu testen, öffne die Verlinkte Datei im Browser (leere Webseite) und öffne die Entwicklertools (F12), schalte die Ansicht auf “Konsole” und lade die Seite neu. Im Quelltext sind ausschließlich globale Variablen verwendet, jedoch funktioniert dieses Script “leider” wie gewünscht. Das Problem mit globalen Variablen ist, dass man den Quelltext dadurch ggf. schwerer lesen kann und diesen nicht wiederverwenden kann. Wenn man z.B. verschiedene Funkionen als unterschiedlichen Skripten zusammenfügt oder zusammen nutzen möchte, welche jedoch ebenfalls globale Variablen nutzen, dann können da sehr eigenartige Ergebnisse bei herauskommen.

JS-Beispiel: mit lokalen Variablen

In den DevTools von Chrome kann man jetzt den entsprechenden Variablen-Scope sehen. Jedoch ist der Quellcode noch nicht wirklich wiederverwendbar, da wir das zu lösende Problem (also das laden und parsen einer JSON-Datei) nicht auf eine eigene Abstraktionsschicht gebracht haben.

JS-Beispiel: mit lokalen Variablen und Klassen

In diesem Beispiel wurde nun die Klasse “PlanetUbuntuuserJsonData” erstellt welche wiederum von der Klasse “JsonData” dessen Eigenschaften (Variablen & Methoden) erbt. Leider ist der Quelltext hierbei von zirka 50 auf zirka 80 Zeilen erhört worden und funktioniert dabei z.B. nicht im IE < 10. (siehe Kommentare im Quelltext)

JS-Beispiel: ohne Variablen + jQuery

Dieses Beispiel benötigt zwar die “jQuery”-Bibliothek, welche jedoch bereits entsprechende Funktionalitäten kapselt. Vergleich man diesen Quellcode mit der Vorherigem Version, kann man schnell erkennen, das entschieden weniger Quellcode deutlich besser zu lesen ist. ;-)

Shell-Beispiel: mit globalen Variablen (test_1.sh)

In diesem Beispiel sind wieder sehr viele globale Variablen verwendet und wieder funktioniert das entsprechende Skript “leider” trotzdem. Die Funktion “parse_json()” gibt nicht einmal einen Rückgabewert zurück, dafür teilen sich die beiden Funktionen die Variablen. Und im Grunde könnte man den ganzen Quelltext auch einfach ohne Funktionen untereinander schreiben, dies hätte den selben Effekt.

Shell-Beispiel: mit lokalen Variablen (test_2.sh)

Die entsprechende Ausgabe ist bereits im Vorherigen Bild zu sehen. Bei Shell-Skripten kommt es seltener vor, dass man dessen Funktionalität wirklich wiederverwenden möchte, jedoch ist der Quelltext deutlich besser zu lesen, wenn man entsprechende Rückgabewerte und Übergabeparameter verwendet.

Quellen / Links:
– Shell: Advanced Bash-Scripting Guide
– Shell: Coding-Style-Guide von “Oh My Zsh”
– JS: Sichtbarkeitsbereich (Scope) von Variablen
– JS: Objektattribut

Ressourcen für Webentwickler

in diesem Blog-Post möchte ich erklären, wie ich mich über neue Technologien, Techniken, Standards, Pattern etc. Informiere. Dabei werde ich mich besonders auf Webtechnologien (CSS / HTML / JS / PHP) konzentrieren.

Zu Beginn unterteile ich die Informationsquellen in verschiedenen Medien “Video”, “Audio”, “Text”, “Praktisches”, welche ich wiederum in unterschiedlichen Situationen nutze. Ein interessanten Podcast zum Thema “Frontent Architektur” vor dem einschlafen oder ein Video zum Thema “DevOp” beim zubereiten vom Mittagessen, morgens in der Straßenbahn ein Buch lesen mit dem Titel “Weniger schlecht programmieren” … um nur ein paar Beispiele zu nennen. Dabei lassen sich einige Webseiten / Apps etc. nicht wirklich in einer der Kategorien einteilen oder gehören eigentlich in mehrere Kategorien.

Wenn man sich näher damit beschäftigt wie wir Informationen verarbeiten und lernen, findet man schnell Begriffe wie “Lerntypen” und “Denkstile”.

Ein Beispiel: Wenn man in der Schulzeit bereits festgestellt hat, dass man allein durch das zuhören den entsprechenden Lernstoff nicht behalten hat und die Vokabeln besser behalten kann, wenn diese farblich markiert sind. Dann ist man wahrscheinlich ein ehr “Visueller”-Lerntype.

Jedoch sollte man dennoch verschiedenen Medien (Visuell, Auditiv, Haptisch, Kommunikativ) nutzen, um sich Vorwissen anzueignen und um sich das Thema interessanter zu gestalten bzw. sein eigenes Interesse daran zu wecken. Das Vorwissen muss dabei gar kein Faktenwissen sein, es reicht vollkommen aus, dass diese Informationen sozusagen als Nährboden herhalten.

Ein Beispiel: Bevor man anfängt einen Blog-Post zum Thema “Ressourcen für Webentwickler” zu schreiben, diskutiert man mit einem Kollegen auf der Arbeit über dieses Thema und schon hat man zwei neue Projekte.

-> Awesome-Web <-

-> Awesome-WebDev-Newsletters <-

Blackfire PHP-Profiler: Fire up the Performance

Am Wochenende habe ich mal wieder ein neues Tool ausprobiert: “Blackfire” ist ebenso wie “Insight” von SensioLabs entwickelt und kann die Performance einer PHP-Anwendung “on the fly” analysieren und visualisieren.

Die Installation besteht aus folgenden Komponenten:

Probe: dies ist die PHP-Extension welche wir auf dem Server installieren
Agent: Dies ist ein Programm, welches ebenfalls auf dem Server installiert wird und die Performance-Daten zu blackfire.io weiterleitet, wo diese dann visualisiert werden
Client (optional): ein CLI-Tool um PHP-Profiling auf der Kommandozeile auszuführen
Companion: dies ist eine Chrome-Extension, welche auf Knopfdruck das PHP-Profiling ausführt
Website: die blackfire.io Webseite zur Darstellung der Ergebnisse

Die Installationsanleitung ist innerhalb von zirka 5 Minuten abgearbeitet und schon kann man schnell und bequem die Leistung / Performance von Änderungen testen und die entsprechenden Ergebnisse miteinander vergleichen.

blackfire.io: Beispiel-Profile von “http://moelleken.org“

PS: wer noch mehr Information benötigt sollte sich Xdebug lokal installieren bzw. aktivieren und die Profile-Daten anschließend via WinCacheGrind (Windows) oder direkt via KCachegrind (Linux) auswerten und visualisieren.

Git (Introduction + Workshop) am 22. Januar 2015 – also heute!

Wer heute Zeit und Lust hat, kann in Düsseldorf ab 19 Uhr bei der trivago GmbH (Bennigsen-Platz 1) beim monatlichen Treffen der “PHP Usergroup Düsseldorf” mehr über “Git” erfahren.

Bisher haben sich bereits 58 Leute für das Treffen auf www.meetup.com/PHP-Usergroup-Duesseldorf/ angemeldet. Wenn du ebenfalls teilnehmen möchte, melde dich einfach vorher bei “www.meetup.com” an und teilt dem Veranstalteter (PHP Usergroup Düsseldorf – vorheriger Link) mit, dass du kommst. So kann man sich auf die zu erwarteten Teilnehmer einstellen, danke!

Eine Einführung in das Versionskontrollsystem Git in Kombination mit einem “on the fly” Workshop. Damit du am Workshop teilnehmen kannst, solltest du deinen Laptop mitbringen und folgende Dinge schon mal vorbereitet haben:

* installiere Git (http://git-scm.com/)
* erstelle einen Account bei Github (https://github.com/)
* erstelle einen SSH-Key und hinterlege diesen bei github (https://help.github.com/articles…)

Dashboard-Leak for the next @PHPUGDus meetup on thursday #Git #Workshop

Mehr Infos zum Event gibt es hier!

Webseite: http://www.meetup.com/PHP-Usergroup-Duesseldorf/events/219616098/
Twitter: https://twitter.com/phpugdus

PS: Und wer glaubt, dass in der PHPUGDus nur über PHP gesprochen wird, sollte sich eines besseren belehren lassen und sich einmal die Titel der letzten Meettups anschauen. ;) Also ggf. bis später und allen noch einen erfolgreichen Tag!

Server-Probleme im Zeitalter von HTTP/2

Ich hatte heute das Problem, dass einige Webseiten extrem langsam bis gar nicht mehr vom Webserver ausgeliefert wurden. Also prüfe ich als erstes mit “htop” ob die CPU ausgelastet ist, danach via “iotop” die Festplatte, mit “iftop” den Traffic, mit “netstat” die offenen Netzwerkverbindungen und via “free” wie viel Speicher noch zur Verfügung steht. Und die Hardware war nicht mal ansatzweise ausgelastet. Nach einigen weitere Tests ist schnell aufgefallen, dass nur “http”-Anfragen betroffen waren. Selbst eine einfach GET-Anfrage eines Bildes ist zeitweise fehlgeschlagen.

Die größte Änderung am Vortag war, dass eine Webseite mit zirka 1 Millionen Usern komplett auf “https://” umgestellt wurde. Daher habe ich kurzfristig wieder auf “http://” umgestellt, jedoch ohne eine Änderung festzustellen.

linux_kill_9 — Quelle: http://www.reddit.com/r/ProgrammerHumor/comments/27vcjg/signal_kill/

Zeitgleich ist aufgefallen das der MySQL-Prozess nicht korrekt neugestartet ist, somit liefen zwei MySQL-Server (ps aux | grep mysql), wobei nur einer wirklich Anfragen angenommen hat. Der zweite Prozess wollte sich nicht mehr via “service mysql restart” neustarten lassen, hat die Fehlermeldung “Can’t connect to local MySQL server through socket ‘/var/run/mysqld/mysql.sock’” produziert und wurde daher via “kill” getötet und anschließend der MySQL-Server neugestartet.

Dies hat auch das Problem mit den langsamen Webseiten behoben, zumindest kurzweilig. Danach hatten “http”-Anfragen wieder Probleme. Im “error”-Logfile (/var/log/apache2/error.log) vom Apache habe ich dann endlich eine Meldung gefunden, welche mich auf die richtige Fährte gebracht hat: “server reached MaxRequestWorkers setting, consider raising the MaxRequestWorkers settings”

Vor einer Woche hatte ich das “SPDY“-Protokoll auf dem Server aktiviert und getestet, alles hat ohne Probleme funktioniert. Dann habe ich gestern die bereits erwähnte Webseite komplett auf “https” umgeroutet und noch immer kein Problem festgestellt. Am Morgen wurden dann Newsletter versendet und eine ganze Menge Leute sind in kurzer Zeit via “https” auf die Webseite gekommen, da das “SPDY”-Protokoll nur mit “https” arbeite haben diese User nicht die üblichen Anfragen (HTTP 1.0 / 1.1) an den Server gestellt, sondern durch Multiplexverfahren mehrere Anfragen gleichzeitig verarbeitet werden.

http-diagram-spdy — Quelle: http://stackoverflow.com/questions/10480122/difference-between-http-pipeling-and-http-multiplexing-with-spdy

Die erste Intuition, dass es etwas mit der “SSL”-Umstellung zu tun hatte war schon mal nicht verkehrt, jedoch hatte ich die entsprechenden Einstellungen nur in der “.htaccess” auskommentiert, die “https”-Verbindungen jedoch nicht zurück nach “http” umgeleitet …

RewriteCond %{SERVER_PORT} !^443
RewriteRule ^ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]

… und den Apache nicht neugestartet, somit waren die aktuellen Anfragen noch aktiv und Nutzer welche auf der Webseite waren haben weiter “https”-Anfragen generiert.

Im nächsten Schritt musste nun festgestellt werden, wie viele Apache Prozesse bzw. gleichzeitige Verbindungen einstellt werden mussten und wie man dies am besten konfiguriert. Die Apache-Dokumentation sagt hierzu folgendes:

“The MaxRequestWorkers directive sets the limit on the number of simultaneous requests that will be served … For non-threaded servers (i.e., prefork), MaxRequestWorkers translates into the maximum number of child processes that will be launched to serve requests. The default value is 256; to increase it, you must also raise ServerLimit.”

Also habe ich via …

netstat -anp | grep -E ":80|:443" | grep ESTABLISHED | wc -l

… bzw. zur groben Orientierung via …

ps aux | grep apache | wc -l

… herausgefunden wie viele http(s) Anfragen bzw. Apache Prozesse aktuell vorhanden sind und habe diese Einstellungen zunächst entsprechend hoch eingestellt (“/etc/apache2/mods-enabled/mpm_prefork.conf”), so dass die Webseite wieder korrekt funktionierte. Anschließend habe ich die zuvor beschriebenen Befehle verwendet, um die endgültigen Einstellungen zu ermitteln. Die folgenden Einstellungen sind an einen Server mit 32G Arbeitsspeicher getestet und sollte nicht einfach übernommen werden.

<IfModule mpm_prefork_module>
ServerLimit 1024
StartServers 1
MinSpareServers 32
MaxSpareServers 250
MaxRequestWorkers 1024
MaxConnectionsPerChild 0
</IfModule>

————————————————–

Lösung: Wenn man das “SPDY”-Modul aktiviert und später auf “SSL” umstellt, sollten man vorher die Apache-Konfiguration anpassen! ;)

————————————————–

Es folgt noch ein kleines Tutorial, wie man “SPDY” für Apache installieren kann. Jeder der bereits auf “nginx” umgestiegen ist, kann dies ggf. bereits ohne weitere Installation ausprobieren: http://ginx.org/en/docs/http/ngx_http_spdy_module.html

Installation: SPDY für Apache 2.2

Download: https://developers.google.com/speed/spdy/mod_spdy/

# z.B.: wget https://dl-ssl.google.com/dl/linux/direct/mod-spdy-beta_current_amd64.deb

dpkg -i mod-spdy-*.deb

apt-get -f install

Installation: spdy für Apache 2.4

apt-get -y install git g++ apache2 libapr1-dev libaprutil1-dev patch binutils make devscripts fakeroot

cd /usr/src/

git clone https://github.com/eousphoros/mod-spdy.git

## wähle deine Apache Version

# z.B.: git checkout apache-2.4.7

# z.B.: git checkout apache-2.4.10

cd mod-spdy/src

./build_modssl_with_npn.sh

chmod +x ./build/gyp_chromium

rm -f out/Release/mod-spdy-beta*.deb

BUILDTYPE=Release make linux_package_deb

dpkg-i out/Release/mod-spdy-beta*.deb

Video:

Links:

– Projekt Webseite: http://www.chromium.org/spdy/

– Quellcode: https://code.google.com/p/mod-spdy/wiki/GettingStarted

– “mod_spdy” für Apache 2.2: https://developers.google.com/speed/spdy/mod_spdy/

– “mod_spdy” für Apache 2.4: https://github.com/eousphoros/mod-spdy

– Online-Test für “SPDY”: https://spdycheck.org/

– Präsentation zum Thema “HTTP/2” von @derschepp: https://schepp.github.io/HTTP-2/

– Browserkompatibilität mit “SPDY”: http://caniuse.com/#search=spdy

Dev-Tools:

Privacy-Tools:

Organisation- / Extra-Tools:

Ähnliche Beiträge:

Installation unter Ubuntu 14.04 via Fremdquellen (PPA)

Ähnliche Beiträge:

Ähnliche Beiträge:

jQuery-Selektor Performance

IMMER Variablen als Cache verwenden

Zusammenfassung:

Ähnliche Beiträge:

1. Was ist Open Source Software?

1.1 Geschichte

1.2 Freie Software ⊆ Open Source Software

1.3 Lizenzen

1.4 Geschäftsmodelle

2. Wo veröffentliche ich Open Source Software?

3. Welche Open Source Software Standards gibt es?

4. Wie veröffentliche ich Open Source Software?

4.2 Beispiel: npm

4.2 Beispiel: bower

4.3 Beispiel: composer

5. Beispiel-Repositories

Quellen / Links:

Ähnliche Beiträge:

Ähnliche Beiträge:

Ähnliche Beiträge:

Ähnliche Beiträge:

Mehr Infos zum Event gibt es hier!

Ähnliche Beiträge:

Installation: SPDY für Apache 2.2

Installation: spdy für Apache 2.4

Video:

Links:

Ähnliche Beiträge: