Liveticker dla TYPO3

Aktualizacje na żywo na stronach TYPO3 wymagają więcej niż pluginu News z auto-refresh

Kluby sportowe, portale informacyjne, gminy przy wynikach wyborów i organizatorzy konferencji potrzebują funkcji, której w rdzeniu TYPO3 po prostu nie ma: chronologicznych, krótkich komunikatów, które pojawiają się na stronie w czasie rzeczywistym, bez konieczności przeładowywania strony przez odwiedzającego. Rozszerzenie liveticker rozwiązuje to pluginem frontendowym, który automatycznie doładowuje nowe wpisy przez AJAX-polling lub WebSocket i wstawia je na górę osi czasu. Redaktorzy wpisują komunikat w backendzie, klikają “zapisz” i komunikat pojawia się na stronie kilka sekund później.

Dla organizacji, które dwa lub trzy razy w roku towarzyszą wydarzeniom na żywo na swojej stronie, rozszerzenie jest pragmatycznym rozwiązaniem. Kto relacjonuje codziennie, powinien rozważyć wyspecjalizowane platformy takie jak Tickaroo, które lepiej pokrywają treści multimedialne, integrację z social media i przepływy pracy wielu autorów.

Typowe scenariusze wdrożenia to wydarzenia sportowe, wybory samorządowe i konferencje

Najczęstszym scenariuszem jest liveticker sportowy. Amatorski klub sportowy towarzyszy meczom domowym tickerem na stronie klubu. Redaktor przy boisku wpisuje bramki, kartki i zmiany w backendzie TYPO3 (najlepiej przez mobilny backend), a wpisy pojawiają się chronologicznie na stronie. Przy meczu IV-ligowym z 500 do 2000 jednoczesnych odwiedzających ticker musi działać stabilnie, nie obciążając serwera.

Drugi scenariusz: wieczory wyborcze w gminach i powiatach. W niedzielę wyborczą gminy publikują wyniki cząstkowe przez liveticker. Komunikaty zawierają udziały głosów, prognozy i komentarze komisarza wyborczego. Wyzwanie: wszyscy odwiedzający oczekują tego samego wyniku jednocześnie, co generuje szczytowy ruch.

Trzeci scenariusz: konferencje i walne zgromadzenia. Stowarzyszenia i związki relacjonują na żywo walne zgromadzenia, aby członkowie, którzy nie są na miejscu, mogli śledzić przebieg. Wpisy zawierają wyniki głosowań, wystąpienia i uchwały. Dla stowarzyszeń zawodowych z 5000 do 50 000 członkami, z których nie wszyscy mogą uczestniczyć w zgromadzeniu stacjonarnym, liveticker jest najprostszą formą cyfrowego uczestnictwa, która nie wymaga infrastruktury do transmisji wideo.

Architektura techniczna opiera się na rekordach TYPO3 z AJAX-pollingiem we frontendzie

Rozszerzenie przechowuje wpisy tickera jako rekordy TYPO3 w dedykowanej tabeli. Każdy wpis zawiera znacznik czasu, tekst, opcjonalny obraz i kategoryzację (np. “gol”, “żółta kartka”, “wynik”). Rekordy należą do kontenera tickera, który jest przypisany do wydarzenia. Redaktor może prowadzić kilka tickerów równolegle, na przykład dla różnych meczów lub wydarzeń w tym samym dniu.

We frontendzie plugin renderuje istniejące wpisy jako chronologiczną listę (najnowsze na górze) i uruchamia JavaScript timer, który w konfigurowalnych odstępach (zwykle: 10 do 30 sekund) wysyła żądanie AJAX do endpointu TYPO3. Endpoint zwraca wszystkie wpisy, które dodano od ostatniego pobrania. JavaScript wstawia te wpisy z animacją na górę listy.

Zaawansowane implementacje wykorzystują WebSockets zamiast pollingu, co redukuje opóźnienie z 10 do 30 sekund do poniżej 1 sekundy. Wymaga to jednak serwera WebSocket (np. Node.js z Socket.io) działającego równolegle do serwera WWW TYPO3. Dla większości stron klubów i gmin to przesada, a AJAX-polling z interwałem 15-sekundowym dostarcza wystarczająco zbliżone do czasu rzeczywistego doświadczenie. Rozwiązaniem pośrednim są Server-Sent Events (SSE), które używają trwałego połączenia HTTP i są prostsze w implementacji niż WebSockets, ale również wymagają wsparcia po stronie serwera.

Częste problemy to obciążenie serwera przy ruchu szczytowym, brak wprowadzania mobilnego i konflikty z cache

Problem pierwszy: obciążenie serwera przy ruchu szczytowym. Gdy 2000 odwiedzających co 15 sekund wysyła żądanie AJAX, daje to 8000 żądań na minutę. Bez strategii cache zwykły serwer na shared hostingu się załamuje. Rozwiązanie: umieścić reverse proxy (np. Varnish lub Cloudflare) przed endpointem AJAX, który cache’uje odpowiedź na 5 sekund. Redukuje to faktyczne odwołania do serwera aplikacji do 12 na minutę zamiast 8000.

Problem drugi: wprowadzanie mobilne dla redaktorów. Backend TYPO3 na urządzeniach mobilnych jest użyteczny tylko w ograniczonym zakresie. Redaktor przy boisku, który w deszczu stuka na smartfonie, potrzebuje uproszczonej maski wprowadzania. Rozwiązanie: własny endpoint ze zredukowanym formularzem (pole tekstowe, dropdown kategorii, przycisk wyślij), zoptymalizowany dla przeglądarek mobilnych.

Problem trzeci: konflikty z cache stron TYPO3. Gdy strona, na której osadzony jest ticker, jest serwowana z cache TYPO3, odwiedzający widzą przestarzałe wpisy. Rozwiązanie: wyłączyć stronę tickera z page cache (USER_INT) lub lepiej: cache’ować stronę i doładowywać tylko obszar tickera przez AJAX, co umożliwia kombinację stron z cache i treści dynamicznej.

Rozszerzenie jest zbudowane dla starszych wersji TYPO3, własne rozwiązania są przyszłościowe

liveticker nie ma oficjalnego wsparcia dla TYPO3 v12 lub v13. Podstawowa funkcjonalność jest jednak na tyle prosta, że nowa budowa jako własny plugin jest w wielu przypadkach bardziej ekonomiczna niż migracja rozszerzenia. Gosign buduje funkcje liveticker jako smukłe pluginy Extbase z endpointem JSON API, z którego korzysta prosty klient JavaScript we frontendzie. Nakład pracy na podstawową implementację (wprowadzanie w backendzie, wyświetlanie we frontendzie, AJAX-polling) wynosi od 3 do 5 dni roboczych.

Zaletą własnego rozwiązania jest to, że wprowadzanie mobilne można zrealizować jako Progressive Web App, dzięki czemu redaktor przy boisku ma zoptymalizowany interfejs wprowadzania. Dodatkowo można umieścić warstwę cache (np. Redis lub Cloudflare Workers) między frontendem a TYPO3, co redukuje obciążenie serwera przy ruchu szczytowym do minimum. Ta architektura skaluje się dla ponad 10 000 jednoczesnych odwiedzających bez problemów z wydajnością.