Auf dieser Webseite geht es um den kostenlosen Chat BlauChat, seine Entwicklung und
seine Herausforderungen.
Bei Fragen, Anregungen oder Beschimpfungen, schreib mir an: ren@blau.chat
Der neue Blauchat ist da
2021-09-03 – von Ren
Fast ein ganzes Jahr ist der letzte Post nun her, ohne dass irgendwas passiert
ist, aber im Laufe der letzten zwei Monate hab ich dann doch endlich was
gemacht, und endlich den neuen Chat in die Welt entlassen!
Der nötige Tritt in den Hintern
Programmieren ist schwer, und – entgegen landläufiger Meinung –
ist auch ein vollwertiger Chat alles Andere als simpel. So kommt es, dass viele
Projekte im Sand verlaufen, weil man auf mehr Widerstand und Komplexität trifft
als man erwartet und schließlich die Lust an der Sache verliert. Ich weiß nicht,
wieviele Versuche ich hatte, einen neuen BlauChat aufzubauen, aber es waren
verdammt viele.
Ich muss sagen, dass ich ab einem gewissen Zeitpunkt schon fast gehofft habe,
dass irgendwas Blödes mit dem Chat passiert, damit ich endlich gezwungen bin,
einen neuen aufzubauen.
Und dann war's auch schon so weit: Eines Morgens ist plötzlich eine
meiner Webseiten nicht mehr erreichbar. SSL-Zertifikat abgelaufen. Was'n da los?
Offenbar war der Server schon etwas veraltet und das Problem lies sich nicht
ohne Weiteres lösen. Und genau auf diesem Server lief auch der BlauChat. Oh-oh.
Zum Glück war das SSL-Zertifikat des BlauChats noch eine Weile gültig –
etwa 25 Tage.
Naja, packste den Chat halt auf einen neuen Server und lässt ihn dort weiterlaufen.
Aber nein. Aus irgendeinem Grund lief der Chat auf dem neuen Server nicht
richtig, obwohl die gleiche NodeJS Version installiert war und alle erdenklichen
Konfigurationsdateien identisch waren.
Okay, whatever. Dann hab ich halt 25 Tage Zeit, um einen neuen Chat zu
programmieren. Coole Challenge.
Aktueller Stand und eine Idee
2020-09-20 – von Ren
Die Entwicklung schreitet voran. Jeden Tag bau ich ein klein wenig was am
neuen Chat, völlig stressfrei. Aber nicht unkompliziert. So'n dynamisches Stück
Software verlangt schon einiges von einem ab.
Farbsortierung
Im alten Chat wurden die Namen der Chatter nach Farbe sortiert, wie ein
Regenbogen. Leider hatte die Sortierung ein paar Problemchen, wie zum Beispiel,
dass User in grau nicht richtig einsortiert werden konnten. Deswegen habe ich
mich gefragt, ob es nicht besser ginge.
Nach etlichen (teils komplizierten) Versuchen kam ich schließlich auf diese
einfache Farbsortierung nach Farbton:
Alle bunten Farben
kommen zuerst, in Reihenfolge des Regenbogens.
Danach die grauen, von hell nach dunkel. Man erkennt, dass ein paar
Ausreißer
dabei sind, aber besser geht es nicht wirklich. Stellt sich
raus, dass Farbsortierung gar nicht so einfach ist, und auch nicht ohne
Kompromisse zu schaffen.
Neue Idee: Einfacher Nickwechsel mit Reservierung der vorherigen Nicks
Es soll Chatter geben, die wechseln gern und häufig ihren Nicknamen. Solchen
sind Registrierungen natürlich ein besonderes Dorn im Auge.
Warum also nicht das Nickwechseln supereinfach machen? Jeder Chatter kann
einfach jederzeit, ohne sich neu einzuloggen, seinen Nick ändern.
Aber Moment!
Was ist, wenn man den neuen Nick nur kurzzeitig nutzen will, als
Gag oder so. Während man sich gerade zum Spaß Manfred64
genannt hat,
schnappt ein böser Troll einem einfach den geliebten Haupttnick weg. Doof.
Die Lösung: Jedes Mal, wenn man den Nick ändert, bleiben die
zuletzt genutzten beiden Nicks reserviert
und können von niemandem anders
genutzt werden. Man besitzt
also gewissermaßen bis zu drei Nicks.
Beispiel: Du registrierst dich als Bart
und nennst dich um zu Homer. Bart
ist nun ein
reservierter Nick und kann nur von dir genutzt werden. Nun änderst du deinen
Nick zu Flanders. Weder Bart
noch Homer
kann noch
von jemandem anders genutzt werden als von dir.
- Flanders (aktiv)
- Homer (reserviert)
- Bart (reserviert)
Du änderst deinen Nick wieder und nennst dich diesmal Burns:
- Burns (aktiv)
- Flanders (reserviert)
- Homer (reserviert)
Damit fällt Bart
aus deinen reservierten Namen raus und kann wieder von
jedem genutzt werden.
Was sagt ihr dazu. Cool oder schwul?
Warum fliege ich ständig aus dem Chat?
2020-09-13 – von Ren
Warum passiert sowas Nerviges überhaupt und was kann man als Benutzer dagegen
tun?
-
Vor allem in digital schlecht entwickelten Ländern wie Deutschland oft der
häufigste Grund für Probleme im Chat. Oft tarnt sich die Ursache, denn andere
Seiten wie YouTube können trotzdem tadellos funktionieren. Wenn ich
gigabyteweise Videodaten streamen kann, warum funktioniert dieser verdammte Chat
dann nicht ordentlich?
Streaming-Webseiten erfordern zwar eine gewisse Bandbreite, aber keine
stabile Internetverbindung. Es mag einem also beim normalen Surfen
vielleicht gar nicht auffallen, dass die Internetverbindung alle paar Sekunden
aussetzt. In einer filigranen real-time-Application wie einem Chat kann das
einem aber zum Verhängnis werden.
- Beim Internetanbieter anrufen und sich beschweren
- Den Internetanbieter wechseln und beten
-
Browser auf dem Smartphone haben einen wesentlichen Unterschied zu ihren
Desktop-Kollegen. Im Desktop-Browser bleiben alle geöffneten Tabs und Fenster
aktiv und führen munter Skripte aus.
Gerät jedoch ein Smartphone Browser-Tab in den Hintergrund, werden alle
Verbindungen zu dieser Webseite gekappt. Der Tab wird eingefroren, damit der
Akku des Geräts geschont wird. Das lässt sich – meines Wissens nach
– auch nicht verhindern.
Ist der Chat also nicht mehr im Vordergrund, geht die Verbindung
(aus rein technischer Sicht) sofort verloren und man fliegt raus.
- Chat-Tab im Vordergrund lassen
-
Wenn mancheiner eine rote Schrift mit dem unschönen Satz Verbindung
unterbrochen
sieht, glaubt er, von einem Moderator absichtlich aus dem
Chat geworfen worden zu sein. Zumindest hier im BlauChat ist das aber niemals
der Fall. Einem Kick oder Bann gehen in der Regel Verwarnungen voraus. Außerdem
erscheint bei einem tatsächlichen Rauswurf eine eindeutige Kickmeldung –
auch für den Gekickten.
Wer ist schuld?
Was kann ich überhaupt dafür, dass ihr alle mieses Internet habt. Bei mir
geht der Chat super, ich fliege nie raus! Und Spirit auch nicht.
– Ren ca. 2015
Auch wenn es manchmal nicht so wirken mag: Webseiten und Apps wie YouTube sind
absolute Meisterleistungen der Technik. Ganze Teams der besten Programmierer der
Welt arbeiten jeden Tag daran, dass die Software auf jedem Gerät und unter den
widrigsten Umständen noch funktioniert. Bemerkt YouTube zum Beispiel, dass der
User gerade schlechtes Internet hat, schraubt es die Videoqualität herunter,
ohne das Video zu pausieren. Das ist schon cool.
Auch wenn YouTube vielleicht nicht das beste Beispiel für eine
Echtzeitanwendung wie einen Chat ist, zeigt es doch, dass man auch
benachteiligten Usern durchaus entgegenkommen kann. Es ist halt oft einfach nur
nicht so einfach!
Weitere Änderungen
2020-09-13 – von Ren
Hier ist eine neue kleine Liste mit weiteren Neuerungen für den neuen Chat.
-
Im alten Chat wurden mehrere Leerzeichen hintereinander immer zu einem
einzigen kollabiert.
Mit dem neuen <code> Tag hat das ein Ende!
Endlich frustfrei im Monospace-Font Quellcode und ASCII-Art posten!
Ob jemand auf dieser Basis vielleicht Spiele-Bots programmieren könnte?
-
Schluss mit der Diskriminierung von Neuchattern! Ab sofort soll jeder Gast
beim Betreten des Chats eine zufällige Farbe bekommen. Das sorgt a) dafür, dass
die Nickliste bunter ist und so einen smootheren Regenbogen-Farbverlauf
ermöglicht. Und zweitens, dass Neulinge nicht mehr auf die falsche Idee kommen,
dass die Farben etwas mit Userrängen zu tun hätten. Okay, hier sind alle bunt
und ich auch, also hat es nichts mit Userrängen zu tun
denken sie sich dann.
-
Hier ist ein Screenshot vom aktuellen Stand der Optik. Das neue Design
gönnt sich für seine Elemente etwas mehr Bildschirmfläche, ist dafür aber,
meiner Meinung nach, wesentlich intuitiver und auch logischer aufgebaut als beim
alten Chat. Den Preis von ein bis zwei Chatzeilen weniger auf dem Bildschirm
zahl ich gern.
-
Dem aufmerksamen Leser ist es im obigen Screenshot vielleicht schon
aufgefallen: Nicknamen dürfen nun ein bisschen länger sein und es sind auch
Leerzeichen darin gestattet. Aber auch einige Sonderzeichen, wie ä, ü, ö,
bekommen grünes Licht.
BB-Code, HTML, Markdown, oder …?
2020-09-06 – von Ren
Eine der technisch etwas kniffligeren Aufgaben jeder
Online-Community-Plattform ist das Implementieren einer sogenannten
Markup-Sprache.
Diese ist dazu da, aus reinem Text, den der Benutzer eingibt,
Formatierungen und Links zu generieren, aber
auch Bilder und YouTube-Videos einzubetten. Dabei muss das ganze
sicher sein, sodass keine Einschleusung von bösartigem Code
möglich ist.
Es gibt dafür mehrere Ansätze, aber wirklich toll ist keiner davon. Im
Folgenden möchte ich die Möglichkeiten vorstellen und auch was aktuell für den
neuen Chat geplant ist:
BB-Code
BB-Code wurde im alten Chat ausschließlich verwendet. Diese Formatierung gibt
es schon seit den Neunzigern und sie war vor allem in Foren sehr beliebt (daher
auch der Name: Bulletin Board Code
).
BB-Code ist vergleichsweise einfach gegen Angriffe abzusichern. Allerdings ist
der Code gewöhnlichem HTML zum Teil sehr ähnlich und wird kaum noch irgendwo
benutzt. Man fragt sich: Warum nicht direkt HTML nutzen?
Beispiele für BB-Code:
[b]fett[/b] → fett
[i]kursiv[/i] → kursiv
[img]https://example.com/image.jpg[/img] →
[url]https://example.com[/url] → https://example.com
HTML
HTML ist die bekannteste Markup-Sprache der Welt und wird auf jeder Webseite
verwendet. Dementsprechend gibt es viele, die sie direkt verstehen, ohne sich
mit einer neuen Sache vertraut machen zu müssen.
Der Nachteil ist, dass sie zum Teil recht verbos sein kann, aber man auch
besonders aufpassen muss wegen Schadcode, da der Browser HTML sofort versteht
und interpretiert – anders als BB-Code oder Markdown.
Beispiele für HTML:
<b>fett>/b> → fett
<i>kursiv</i> → kursiv
<img src="https://example.com/image.jpg"> →
<a href="https://example.com" target="_blank">https://example.com</a> → https://example.com
Spätestens beim Anblick des langen Codes für Links kann man erahnen, dass das
Ganze zu komplex wäre für die Eingabebox eines Chats. Reines HTML kann also
nicht die Lösung sein.
Markdown
Markdown ist eine recht junge Markup-Sprache und erfreut sich großer
Beliebtheit. Sie ist anzutreffen bei Reddit, Github und vielen weiteren
Webseiten.
Der Rohtext ist zum größten Teil sauber, gut lesbar und leicht zu schreiben.
Die Sprache ist auch vergleichsweise einfach zu implementieren.
Beispiele für Markdown:
**fett** → fett
*kursiv* → kursiv
![alt text](https://example.com/image.jpg "optional title text") →
<https://example.com> → https://example.com
Und dann sieht man den Code zum Einbetten eines Bildes und denkt sich
nur noch… wtf?
Dass es sich hierbei um den Code zum Einbetten eines Bildes handelt, ist kaum
zu erahnen. Ich finde das wesentlich schlimmer als die HTML-Variante.
Und warum sieht der normale Link-Code schon wieder ganz anders aus? Wo ist das
System. Was hat man sich dabei gedacht. Und wenn wir schon dabei sind: Ich will,
dass auch mal eine für Chats typische Handlung
wie *seufz* getippt werden
kann, ohne dass ein seltsames seufz draus wird, gefolgt von
einem Huch, warum ist das jetzt fett
.
WYSIWYG-Editor
Dieser furchtbare Buchstabensalat heißt ausgeschrieben What you see is what
you get
und bedeutet, dass es gar keinen für den User sichtbaren Markup-Code
gibt. Der Text ist schon in der Eingabemaske formatiert, so als würde man in
Word schreiben.
Klingt erstmal toll, und war eine Weile auch recht beliebt, aber zurzeit sehe
ich das immer seltener. Der Grund ist, dass das bei der Implementierung absolute
Hölle ist, und man als Entwickler gegen den Browser ankämpfen muss, denn der ist
für sowas gar nicht ausgelegt.
Aber auch die User-Experience ist fragwürdig, denn eine perfekte Ausführung
davon habe ich noch nie gesehen. Man arbeitet sich als User immer um
irgendwelche Bugs herum. Es ist fast so, als würde man ein noch schlimmeres Word
verwenden.
Meine Lösung
Ich sage hier deutlich meine Lösung, denn eine
allgemeingültige existiert nicht. Und ich bin mir nicht mal sicher, ob sie
überhaupt irgendeinen Sinn macht, aber das zeigt sich dann spätestens im
Chatbetrieb.
Ich wähle eine Mischung aus HTML und einer eigenen
Syntax.
Unterstützte Codes:
<b>fett</b> → fett
<i>kursiv</i> → kursiv
<u>unterstrichen</u> → unterstrichen
<s>durchgestrichen</s> → durchgestrichen
[image:Z0VL-BW9_4kIUcNa] →
[audio:Z0VL-BW9_4kIUcNa] → Eingebettete Audiodatei (mp3, ogg, …)
[video:Z0VL-BW9_4kIUcNa] → Eingebettetes Video (webm, mp4, …)
[youtube:Z0VL-BW9_4kIUcNa] → YouTube Video
https://example.com → https://example.com
(Was noch fehlt aber kommen sollte: Spoiler, Zitate)
Für einfache Textformatierungen wird HTML verwendet, Links werden ohne
weiteres Zutun übernommen und Bilder und Videos werden mithilfe einer eigenen
Syntax eingebettet. Man beachte, dass oben kein Bildlink zu sehen ist. Das liegt
daran, dass der Chat nicht mehr direkt zu anderen Bildern verlinken wird,
sondern als Proxy-Server tendiert, dh. das Bild vorher selbst runterlädt, um es
dann an die User auszugeben.
Um also ein Bild direkt einzubetten, wird vorher eine Maske (zB. in Form eines
Popups) aufgerufen, und dort der Bildlink eingefügt. Als Resultat bekommt man
ein fertiges Codeschnippsel inkl. ID der Datei (oder eine Fehlermeldung, wenn es
nicht geklappt hat).
Ich denke, dass diese Lösung die meisten Vorteile für den Chat bietet.
Gewöhnliches HTML, zum Formatieren von Texten, darf ruhig bleiben wie es ist.
Komplexere Sachen wie Bilder und Videos sollen trotzdem einfach sein. Deren
Codes folgen zwar keinem Standard, werden aber sowieso nicht von Hand getippt.
Die Änderungen im Wesentlichen
2020-09-03 – von Ren
Ich höre viele sagen: Warum soll es überhaupt einen neuen Chat geben,
der alte ist doch gut!
– Ja und nein.
Es ist nun nicht so, dass der alte Chat ein auf veralteter Technik
(wie zB. Flash & Java-Applets) basierender Softwaredinosaurier wäre, aber
als er vor ca. 5-6 Jahren zum ersten Mal das Licht der Welt erblickte, war er
schon so ziemlich das Modernste auf dem Chatmarkt! Während andere noch mit PHP
Polling beschäftigt waren (und es selbst heute noch zum Teil sind), war der
BlauChat längst mit modernem Kram wie NodeJS und Websockets unterwegs, yo! Auch
war er einer der ersten Chats mit echtem Mobile-Support.
Allerdings muss man dazu sagen, dass ich in der Zeit noch kaum Skills
für die Webprogrammierung übrig hatte, und entsprechend sieht der Code auch aus.
Am alten BlauChat, so wie er jetzt ist, jetzt weiterzuarbeiten, wäre für mich
unmöglich.
Mittlerweile hat die Konkurrenz
auch etwas aufgeholt und der Chat
fühlt sich nicht mehr so besonders an. Deshalb gilt es nun, ein bisschen Abstand
zu gewinnen.
Das alles kommt also auf uns zu, in absteigender Wichtigkeit:
-
Vermutlich das Nervigste am alten Chat: Vor allem mit mobilem Gerät
fliegt man schnell raus und muss sich ggfs. neu einloggen. Nicht so nice. Das
soll sich ändern.
-
Der Chat bekommt interne Tabs für Räume und Privatchats. Um in
mehreren Räumen anwesend zu sein, muss man keine weiteren Browserfenster mehr
öffnen, und Privatchats mit anderen Leuten werden auch in eigenen Tabs geführt.
-
Man wird in der Chatterliste links nicht mehr ständig alle Räume
mitsamt der Chatter sehen. Das ist und war schon immer ungemütlich. Stattdessen
wird die Raumliste mit einem neuen Räume
-Button kurz aufgerufen und nach
Raumwahl auch direkt wieder geschlossen.
-
Auf Wunsch einiger User möchte ich nun auch Offlinenachrichten
einbauen. Das heißt, dass man auch einem Chatter, der gerade nicht da ist, eine
Privatnachricht schreiben kann. Ich stelle mir das verdammt nützlich vor.
Datenschutztechnisch ergeben sich dadurch zwar neue Fragen, aber die
lassen sich sicher leicht beantworten, indem man Privatnachrichten zB. einfach
jederzeit manuell leeren
kann oder so. Außerdem werden generell
alle Nachrichten nach 30 Tagen gelöscht. Man sollte also
zumindest einmal im Monat im Chat vorbeischauen!
-
Alle geposteten Bilder sollen nun (vorübergehend) auf dem Server
gespeichert werden. Das hat mehrere tolle Vorteile. Einer davon ist, dass man
die eigenen nun immer verfügbar haben wird, und sich keine Sorgen machen muss,
dass sie verlorengehen (solange man seinen Account nicht verliert, duh).
-
Angeklickte Videos sollen nicht mehr im Chatverlauf erscheinen und
mitscrollen, sondern stattdessen zB. oben rechts befestigt sein, wie ein
Kneipenfernseher.
-
Im Großen und Ganzen sind alle mit dem klassischen
dunkelblauen Design zufrieden, und ich auch. Deshalb sollen die Änderungen hier
gering sein. Alles bleibt ungefähr an seinem Platz. Aber ich denke es
wird dennoch ein bisschen nicer. Screenshots folgen.
Ich habe hier bestimmt die Hälfte an Neuerungen vergessen, aber die trag
ich dann einfach nach, wenn es mir wieder einfällt.
Der neue Chateingang
2020-08-29 – von Ren
Nicht dass der alte Chateingang besonders kompliziert gewesen wäre, aber
der neue wird noch simpler. Eine Registrierung ist dann auch nur noch von
innen
möglich, also nachdem man den Chat zunächst als Gast betreten hat.
Das ganze nennt sich dann Nickname schützen
oder so ähnlich.
Über den BlauChat – Was bisher geschah
2020-08-29 – von Ren
Chats und Internetforen fand ich eigentlich schon immer cool. Eine der ersten
Webseiten, die ich besuchte, war chatworld.de. Später war ich viele Jahre lang im chat4free.de
unterwegs.
Doch mit der Zeit wurde ich immer unzufriedener mit dem, was es gab, und
beschloss, ca. 2010, einen eigenen Chat zu starten – mit Blackjack und
Nüssen. Von Webprogrammierung hatte ich damals nicht viel Ahnung und nahm
deshalb zunächst einen kostenlosen Fertigchat, den ich an meine Wünsche
anpasste. Später programmierte ich die Chatsoftware komplett selber.
Ganz langsam wuchs die Chatterschaft. Aber erst 2015, relativ kurz bevor der
chat4free vom Netz genommen wurde, begann die kleine BlauChat-Gruppe aktiv für
sich zu werben, und das mit Erfolg. Viele Chatter erkannten das Potenzial eines
entspannteren, liebevollen Chats, der nicht auf Flirt und Profit ausgerichtet
ist, und besuchen ihn seitdem regelmäßig.
Allerdings ist irgendwann auch die beste Chatsoftware nicht mehr zeitgemäß.
Nach über fünf Jahren treuen Dienstes soll dieser Chat nun ersetzt werden durch
einen neueren, moderneren, noch besseren!