Internet mal anders

  • Entwicklung

    Entwicklung/Programmierung
    Entwicklung/Programmierung

    Entwicklung

    Die hier aufgeführten Routinen sind zum großen Teil Bestandteile meines eigens für meine Homepage entwickelten CMS, sie sollen zeigen was mit Free Pascal auf der Server-Seite und JavaScript auf der Client-Seite alles möglich ist.

    Lazarus / Free Pascal

    • GZIP / deflate
      GZIP / deflate Stream Funktionen programmiert in Free Pascal zum Einatz im ISAPI-CMS
    • brotli
      Ein einfaches Interface zu Googles brotli library in Free Pascal
    • CMS-Daemon
      Der Content management system (CMS) Hintergrund Service (Daemon) der alle Arbeits-Funktionen der Auftritte übernimmt.
    • Daemon (Service)
      Daemon (Service) Beispiel in Free Pascal
    • RecycleAppPool
      Kennt Ihr das Problem der Server (IIS) hängt immer wieder aber Ihr findet den Fehler nicht, denn der Server hängt ja und kommt gar nicht dazu einen Eintrag ins Logfile zu schreiben.
    • ISAPI
      Webserver - Erweiterung mit Lazarus (Free Pascal) oder Delphi. ISAPI - Filter und ISAPI - Extensions sind die performanteste Möglichkeit einen Webserver wie z.B. den IIS von Microsoft im Funktionsumfang zu erweitern.
    • ISAPI-Interface
      Free Pascal Internet Server Application Programming Interface v 7.0
    • ISAPI-Interface Example
      ISAPI Extension auf der Basis des ISAPI-Interfaces
    • ISAPI-Filter
      Internet Server Application Programming Interface Filter
    • Erstellen eines Apache Modules
      Erstellen eines Apache Modules mit Hilfe von Free Pascal
    • dynamisch angepasste Bilder
      Dynamisch on-the-fly skalierte Bilder ohne Caching ist möglich, platzsparend und nativ unter Free Pascal sehr schnell.
    • FPWriteGIF
      Routine zum Schreiben von GIFs, lesen gibt es ja schon!
    • GMT - Greenwich Mean Time
      GMT - Greenwich Mean Time Funktionen programmiert in Free Pascal zum Einatz im ISAPI-CMS
    • Etag
      Etag zur Überprüfung des Datenstroms auf Änderung, theoretisch ist hier jede Prüfsumme möglich.
    • Browscap
      Ermittlung der Browser Eigenschaften anhand des User Agent Strings mit Hilfe von browscap.ini programmiert in Free Pascal
    • Browscap Apache Module
      Ein Modul zur Nutzung der Browscap.ini auf dem Apache 2.2 Webserver
    • Browscap ISAPI-Filter
      An ISAPI-Filter to use the browscap.ini File Values on the IIS, with any programming language.
    • Your browscap values
      This is the running Example for the Free Pascal version of the browscap.ini parser.
    • browscap.ini issues
      Problems in the analysis of user agent strings based on the browscap.ini
    • JSMin
      JSMin - JavaScript Minifier programmiert in Free Pascal zum Einatz im ISAPI-CMS
    • CSSMin
      CSSMin - Cascading Stylesheet Minifier programmiert in Free Pascal für das ISAPI-CMS
    • ADO & Free Pascal
      Ob OLE DB, ADO oder Zeos die Möglichkeiten für Free Pascal um auf Datenbanken zuzugreifen, sind mannigfaltig doch wo liegen die Unterschiede, sind Packages erforderlich oder reichen manchmal ein paar Code-Zeilen?
    • ADO ConnectionString
      Der ConnectionString kann mit dieser kleinen Routine erstellt werden, aber auch zum direkten verbinden mit der Datenbank genutzt werden.
    • ADOX Access MDB erzeugen
      Beispiel Access Datenbank ERzeugung über die ADOX Interface Library in Free Pascal
    • JRO Access MDB komprimieren
      Beispiel Access Datenbank Komprimierung über die JRO Interface Libraries in Free Pascal
    • Datenbank XML-Export
      Beispiel XML Export über die ADO Interface Libraries in Free Pascal
    • ADO SQL Dump
      Beispiel SQL Dump über die ADO Interface Libraries in Free Pascal
    • ADO Klassen Beispiel
      Beispiel für die Entwicklung einer ADO Klassen Bibliothek in Free Pascal
    • Base32
    • Service Control
      TrayIcon in der Taskleiste zum steuern eines eigenen Dienstes/Service

    JavaScript

    • Internet mal anders
      Dieser Webserver inklusive Website und CMS ist komplett in Free Pascal programmiert.
    • Observer
      IntersectionObserver und ResizeObserver Polyfill
    • Lazy Loading YouTube (external content)
      Lazy Loading YouTube JavaScript API, Einbindung datenschutzkonform mit Hinweis auf externen Content
    • Lazy Loading Videos und der Viewport
      JavaScript basiertes Video Lazy Loading inklusive Autoplay, Poster und Sourcen
    • Slider
      JavaScript Slider, slided auf scroll Basis, daher minimaler JavaScript Aufwand
    • Object Fit Cover
      JavaScript Object Fit Cover IE Fallback
    • Focus (Point)
      Zentrierung Bild im Rahmen leicht gemacht
    • Lazy Loading Images (Viewport)
      Lazy Loading nativ, per Observer oder Event gesteuert abhängig von den Fähigkeiten des Browsers den aktuellen Viewport zu ermitteln.
    • Sticky (Header)
      Sticky Header / Elements realisiert im Stylesheet und als JavaScript Fallback
    • Sticky mit Banner
      Sticky Header / Banner Elements realisiert im Stylesheet und JavaScript Observer
    • Smooth Scroll
      Smooth Scroll realisiert im StyleSheet mit JavaScript Fallback
    • autoresize Textarea
      Das Textarea verändert seine Höhe mit zunehmender Zeilenzahl
    • OpenStreetMap
      Simples OpenStreetMap Beispiel mit Leaflet
    • OpenStreetMap Marker
      Simples OpenStreetMap Beispiel mit Leaflet und nominatim.openstreetmap.org
    • External Links
      DSGVO konforme Lösung beim Absprung (Verlinken) auf fremde Domains in vanilla JS
    • Event-Tracking
      Event-Tracking auch ohne Google
    • Tabsheet
      JavaScript Tabsheet ohne großes Framework
    • Accordion
      JavaScript Accordion ohne großes Framework
    • Treeview
      JavaScript Treeview ohne großes Framework
    • Page Browser
      JavaScript Page-Browser ohne großes Framework
    • Fade
      Sicherlich gibt es einige fertige Routinen um einen Fade Effekt zu erzielen, z.B. jQuery .fadeIn() und fadeOut(), aber manchmal reicht auch die kleine Lösung.
    • use canvas for grayscale
      Mit JavaScript farbige Bilder in Graustufen anzeigen
    • Fader
      JavaScript Fader ohne großes Framework
    • an other Fader
      Ein weiter Fader ohne Framework, alles nur mit JavaScript.
    • Animate
      Sicherlich gibt es einige fertige Routinen um eine Animation (slide, resize, ...) zu erzielen, z.B. jQuery .animate() aber manchmal reicht auch die kleine Lösung.
    • CSS Animate
      Sicherlich gibt es einige fertige Routinen um eine Animation (slide, resize, ...) zu erzielen, z.B. jQuery .animate() aber manchmal reicht auch die kleine Lösung, hier nun die Variante mit CSS Transitions.
    • Fader MovingBoxes
      JavaScript Fader ohne großes Framework
    • animated scrollTo
      JavaScript easing Scroll to Element, ohne großes Framework.
    • FitText
      Wer kennt es nicht, mal wieder bricht die Überschrift um, aber eigentlich dürfte sie lieber kleiner sein als umbrechen, also einfach die Schriftgröße eins - zwei Pixel kleiner, aber nur an den Stellen wo es erforderlich ist!
    • Scroller
      Bei meiner Suche nach einer Scroll Komponente bin ich auf alle möglichen Probleme gestoßen.
    • Redirect
      Auf alle Fälle sicherstellen das Client-Seitig eine Umleitung ausgeführt wird.
    • Show & Hide Controls
      Show & Hide Controls with a little bit JavaScript
    • UNIX Timestamp
      Unix Timestamp umrechnen ins lesbare Datum & Uhrzeit Format, sofort online.
    • Base64
      Base64 decode / encode, sofort online.
    • Ticker
      HTML marquee Ersatz
    • Password Field
      Passwort Feld auf Basis eines Input Feldes des Typ Text realisieren
    • Web-App Google Maps
      Google Maps und Tracking
    • Share on Social Network
      Links zum Verteilen :), simpel, kurz und ohne viele Worte.

    C#

    • C# Browscap
      An experimental realization of a class to use the browscap.ini with C#.
  • Administration

    Administration
    Administration

    Administration

    Hier finden Sie Themen zur Server Administration und Konfiguration, Anleitungen und Hilfestellungen.

    • UNIX Timestamp
      Unix Timestamp umrechnen ins lesbare Datum & Uhrzeit Format, sofort online.
    • UserContent.css
      HTML Fehler finden leicht gemacht, erster Schritt erst einmal sichtbar machen
    • RecycleAppPool
      Kennt Ihr das Problem der Server (IIS) hängt immer wieder aber Ihr findet den Fehler nicht, denn der Server hängt ja und kommt gar nicht dazu einen Eintrag ins Logfile zu schreiben.
    • customize browscap.ini
      Online custumization of the browscap.ini to optimize performance
    • wirklich privates Hosting
      Wechselnde IP bei VDSL kein Problem für den eigenen Webservice zu Hause, kurze Anleitung zur Einrichtung
    • Ubuntu
      Ubuntu installation infos for developer
    • Google Such-Index
      Es gibt Dateien die selbst für Suchmaschinen oder sogar insbesondere für sie relevant sind, die aber nichts im Such-Index zu suchen haben. So ist darauf zu achten, dass auch nur Dateien in den Such-Index geraten, die dort hin gehören!
    • .htaccess Browsercache
      Browserseitiges Caching über den HTTP-Header in der .htaccess für den Apache Webserver aktivieren
    • .htaccess: Komprimierung
      GZIP Komprimierung falls vom Clientüber den HTTP-Header akzeptiert in der .htaccess für den Apache Webserver aktivieren
    • IIS
      Eine kurze Anleitung zur Einrichtung des ISAPI CMS im IIS7.5 unter Windows 7
    • ISAPI-Extenson und Apache
      Einbinden einer ISAPI-Extenson im Apache Webserver
    • Externe Schriften
      Externe Schriften können ganz einfach über .htaccess im Apache erlaubt und der Zugriff auf den Domainbereich eingeschränkt werden!
  • Analyse

    Analyse/SEO
    Analyse/SEO

    Analyse

    Fehler finden, Möglichkeiten entdecken und Konzepte zur Umsetzung.

    • Your browscap values
      This is the running Example for the Free Pascal version of the browscap.ini parser.
    • browscap.ini issues
      Problems in the analysis of user agent strings based on the browscap.ini
    • HTTP-Headers – Page Speed
      Performance Verbesserungen des CMS
    • ansprechende Google Sitemap
      Gestaltungsmöglichkeit für die Google-Sitemap über XSL
    • SEO-Checkliste
      SEO Search Engine Optimization Checkliste zur Überprüfung eigener Optimierungsversuche
    • SchemaOrg Microdata
      Der Einsatz von Auszeichnungen zur Strukturierung von Daten ist vor allem von Vorteil für Suchmaschinen, entwickelt von Google, Bing und Yahoo ist gerade bei diesen mit Erfolg zu rechnen.
    • OpenSearch
      Eigenes Suchfeld für gängige Browser anbieten
    • Google+ Autoreninformationen
      Google zeigt in seinen Suchergebnissen Urheberinformationen (Autor des Artikels) an, dafür muss der Artikel mit dem Google Profil verknüpft werden (dafür ist natürlich ein Google Profil/Account erforderlich).
    • SEO Website-Analyse
      SEO Website analyse durch parsen der Webside und HTML-Analyse
    • URL
      Bestandteile der URL und deren Zusammensetzung in tabellarischer Form

Besonderheiten dieser Website

Diese Website basiert auf einer in Free Pascal geschriebenen Webserver-Application, ein Dienst/Service mit einen HTTP-Server-Prozess und einen Hintergrund-Prozess. Wobei der HTTP-Server-Prozess für die komplette Bearbeitung der Eingehenden Anfragen zuständig ist und der Hintergrund-Prozess sich um die Abwicklung von Aufgaben die nicht unmittelbar mit den eingehenden Anfragen zu tun haben wie z.B. um Optimierung von Dateien, generieren von Statistiken und Updates. Alle Komponenten des Webservice wurden komplett in Free Pascal programmiert.

Bis zum 21.06.2015 basierte diese Website noch auf der ISAPI-Schnittstelle des IIS von Microsoft, da mir nach einigen Tests klar wurde das eine weitere zeitliche Optimierung nicht mehr möglich war, da die anfallenden Millisekunden fast komplett im Bereich des Servers anfielen, hatte ich mich entschlossen einen eigenen Webserver zu schreiben. Im Gegensatz zu den bekannten Webservern ist bei meinem Webserver keine aufwendige Installation und Konfiguration erforderlich, anhand der Dateitypen wird z.B. automatisch das beste Verfahren zur Übertragung gewählt, also z.B. GZip Komprimierung, Minimierung, Gültigkeit, … und alles nativ ohne Einbindung externer Module, dadurch war eine erhebliche Steigerung der Verarbeitungsgeschwindigkeit möglich. Zurzeit wird die Antwortzeit lediglich durch den dynamischen DNS Eintrag über MyFritz meiner Fritzbox an einem VDSL-Anschluss gebremst, die eigentlichen Verarbeitungszeiten des Servers sind außer bei sehr komplexen Seiteninhalten wie große Source-Listings oder riesige Bildergalerien auf meinem nun über 10 Jahre alten Rechner kaum messbar.

Bis zum 20.10.2018 lief dieser Webservice noch unter Windows, nun läuft er unter Ubuntu.

Ich bemühe mich ständig aktuelle Standards zu implementieren, darunter sind z.B. folgende Leistungsmerkmale:

  • lauffähig unter Windows und Linux (dank Free Pascal Cross-Compiler)
  • SSL (TLS 1.3) Implementierung über OpenSSL, überprüft mit www.ssllabs.com (A+)
  • CSP und Cookies optimiert auf Basis von securityheaders.com (A+)
  • HTTP, HTTPS inklusive SNI Realisierung mit HSTS und HTTP/2 über TLS-ALPN Unterstützung
  • Google PageSpeed Insights (97-100%) und Google Lighthouse (Feature im Google Chrome) optimiert
  • IPv4 und IPv6 Unterstützung, Überprüfung mit IPv6 test
  • GZip / Deflate / Brotli (Brotli Libraries) / Zstd (Zstd Libraries) / Compress(LZW) Komprimierung auch von dynamischen Inhalten
  • dynamisches Minimieren von CSS und JavaScript
  • dynamische Bild Komprimierung / dynamischer Content-Type WebP und Avif, basierend auf dem vom Browser unterstützten Formaten (Accept Wert im HTTP Header)
  • realisiert in Vanilla-JS (ohne JavaScript-Frameworks also reines JavaScript) und dadurch sehr schnell
  • dynamisch generierte Sitemaps: Pages, News, Images, Videos
  • dynamisch generierte RSS-Feeds, Open Search, Open Graph, vCard, iCal, …
  • mit allen wichtigen Icons, überprüft mit Favicon checker
  • kurze sprechende URLs
  • Schema.org realisiert in zahlreichen Elementen wie z.B. Navigationspfade, Logos, Sitelinks-Suchfeld, Videos, WebPage, Organization, Article, Person, … Überprüfung mit Google Testtools für strukturierte Daten
  • Social Media Bookmarks inklusive native sharing, wenn es vom Endgerät unterstützt wird
  • native Volltextsuche auch über Bilder und Downloads wie z.B. PDF-Dateien
  • Backend mit extrem optimierten WYSIWYG Editor
  • Barrierearm, überprüft mit wave.webaim.org (0 Errors)
  • Seitengenerierung dynamisch, also ohne "Caching"
  • dynamische generierte Bilder (dem Endgerät angepasst)
  • Viewport (lazy loading) für Bilder (auch Video-Poster und Background), Videos, YouTube, OpenStreetMap, IFrames, …
  • W3C konforme Inhalte, Überprüfung mit W3C - Markup Validation Service (keine Fehler, keine Warnungen)
  • SEO optimiert
  • HTML5 / XHTML 1.1, CSS3, JavaScript mit aktuellen Features wie z.B. Slider, Accordion, Tabsheets, …
  • Responsive Webdesign
  • Print CSS
  • Seiteninhalt als PDF, RTF (Richtext), Markdown, LaTeX, HTML und Text oder auch als Package (Zip-Archiv - zur Verwendung in einer App) abrufbar/herunterladbar
  • datenschutzkonform

Weitere Informationen findest Du unter CMS.

Manche Bereiche dieser Website sind nur für Freunde offen, falls Ihr noch keine Zugangsdaten habt meldet Euch doch bei mir!

Die ganzen Bilder liegen nicht in den angezeigten Auflösungen auf dem Server, sondern werden während der Laufzeit angepasst für Euer Browser-Fenster zur Verfügung gestellt!

Kontakt

Udo Schmal
Udo Schmal

Udo Schmal
Softwareentwickler
Ellerndiek 26
24837 Schleswig
Schleswig-Holstein
Germany




+49 4621 9785538
+49 1575 0663676
+49 4621 9785539
SMS
WhatsApp

Google Maps Profile
Instagram Profile
vCard 2.1, vCard 3.0, vCard 4.0

Service Infos

CMS Info

Product Name:
UDOs Webserver
Version:
0.5.1.217
Description:
All in one Webserver
Copyright:
Udo Schmal
Compilation:
Sun, 10. Nov 2024 00:22:34

Development Info

Compiler:
Free Pascal FPC 3.3.1
compiled for:
OS:Linux, CPU:x86_64

System Info

OS:
Ubuntu 22.04.5 LTS (Jammy Jellyfish)

Hardware Info

Model:
Hewlett-Packard HP Pavilion dm4 Notebook PC
CPU Name:
Intel(R) Core(TM) i5-2430M CPU @ 2.40GHz
CPU Type:
x86_64, 1 physical CPU(s), 2 Core(s), 4 logical CPU(s),  MHz