Jarosław Zabiełło - BLOG: Tag mvc

Szablony i wzorzec MVC - cz. III

Jarosław Zabiełło — Sun, 14 Jan 2007 04:25:00 +0100

W poprzedniej części omówiono szablony dedykowane głównie do współpracy z designerami bojącymi się programować. Były to albo szablony wkładające swoją logikę do znaczników XML/XHTML (ZPT, SimpleTAL, Kid, Genshi, MasterView, PHP TAL), albo szablony posiadające swój własny, specjalizowany język (Smarty, Django, Jinja, Liquid). W założeniu taki język miał być prostym substytutem języka używanego w warstwie kontrolera. Szablony tego typu może są wygodne dla designera, ale na pewno nie dla programisty, który musi je przygotować. Po pierwsze, trzeba się uczyć kolejnego języka… szablonów. Po drugie, wszystkie tego typu języki są ograniczające dla programisty. Mimo że pozornie prostsze, w praktyce są bardziej złożone i to nawet dla designera. Np. szablony Django i Jinja nie posiadają żadnej składni na określenie trywialnego warunku większości, mniejszości:

{{ x }} jest 
{% if x > y %} 
    większe 
{% else %} 
    mniejsze 
{% endif %} 
od {{ y }}

Powoduje to masę kłopotów dla programisty¹. Prymitywna składnia szablonu wymusza więc kupę dodatkowej pracy. O ileż prościej jest użyć po prostu pełnej składni języka tak jak to robią szablony Cheetah:

$x jest 
# if x > y 
    większe 
# else 
    mniejsze 
# endif  
od $y

Dochodzimy tu więc do sytuacji kiedy byśmy chcieli coś bardziej elastycznego – pełnego dostępu do języka programowania. Taka sytuacja jest pożądana wtedy kiedy i tak szablony budują programiści na podstawie dostarczonego czystego kodu HTML od designerów.

PHP

Język PHP jest dosyć specyficzny, bo w istocie jest to język szablonów. Tzn. pierwotnie tak został stworzony, ale z czasem się skomplikował że dostąpił miana języka skryptowego. Ale jego korzenie widać w składni, która z definicji jest zagnieżdżaniem instrukcji PHP wewnątrz kodu HTML. Idąc tym tropem, niektórzy pomyśleli, że nie ma sensu wymyślać dodatkową składnię. Wystarczy użyć PHP w odpowiedni sposób. I tak powstały szablony Savant.

Właściwie to Savant nie powinny nazywać się szablonami, bo to nic innego jak PHP użyty w taki sposób, aby rozdzielić warstwę prezentacji, od wartwy logiki biznesowej. A skoro to PHP, to odpada nauka dodatkowej składni oraz potrzeby kompilacji specjalizowanego języka szablonów do końcowego kodu PHP (jak to ma miejsce w szablonach Smarty).

Czy takie podejście jest lepsze, czy gorsze, to już każdy może sobie ocenić. Moim zdaniem PHP ma na tyle mętną składnię, że warstwa prezentacji używająca Smarty² jest bardziej czytelna niż czysty PHP jaki używają Savant.

Ruby

Kiedy mówimy o Ruby w kontekście stron internetowych to najczęściej mamy na myśli jego najsłynniejszy framework – Rails. Ruby sam w sobie nie jest związany z HTML tak jak PHP. Rails do szablonów używa biblioteki ERb (ang. “embed Ruby”, czyli “zagnieżdżony Ruby”) Składnia jest bardzo podobna do PHP, JSP czy ASP. Ruby jest tu językiem zagnieżdżonym w HTML.

<%= x %> jest 
<% if x > y %> 
    większe 
<% else %>
    mniejsze 
<% end %>
od <%= y %>

Python

Jeśli chodzi o Pythona to istnieje cała masa systemów szablonowych. Ograniczę się do paru, tych bardziej interesujących.

Spyce

Szablony Spyce zostało stworzone jako pythonowa konkurencja dla PHP. Podobnie potrafią przeplatać język (tu: Pythona) z tagami HTML. Najbardziej oczywista przewaga Spyce wynika z faktu używania języka Python, który jest znacznie lepiej zaprojektowany i posiada dużo więcej możliwości niż PHP. Spyce potrafii budować własne znaczniki (custom tags, podobnie jak to potrafią javowe JSP) oraz łatwiej w nich zbudować komponenty, kod do wielokrotnego użytku.

Myghty

Szablony Myghty powstały pierwotnie jako pythonowa implementacja systemu komponentowego Mason dla Perla. Mimo wielu podobieństw, Myghty są znacznie potężniejsze o Masona, np. intensywnie wykorzystują obiektowość Pythona (zobacz różnice). Od początku Myghty powstało z myślą o dużych obciążeniach, ciężkich, profesjonalnych zastosowaniach. Mają doskonały własny cache, są bardzo szybkie, odporne na wątki, świetnie się nadają do tworzenia komponentów.

Programiści Pythona bardzo cenią sobie filozofię tego języka (która podkreśla prostotę, oczywistość i elegancję składni). Problem w tym, że Myghty dla pythonowców jest zbyt podobne do Perla. Są za mało “pythonic” – pythonowe. Dodatkowo, poprzez podkreślanie swojej komponentowości, Myghty niektórym zbyt kojarzy się z filozofią komponentową frameworku ASP.NET (a wzorzec MVC wydaje się być bardziej przejrzysty niż wzorzec sterowanych zdarzeniami komponentów). Myghty, jako system komponentowy, może być używane w stylu MVC, ale nie jest to takie naturalne i oczywiste. (Na szczęście, wszystko zmienił Pylons który zapewnia przejrzystą pracę zgodną z wzorcem MVC i Myghty są tam zredukowane tylko do obsługi szablonów szablonów. Sterowaniem zajmują się kontrolery Pylonsa a nie Myghty).

Cheetah

Szablony Cheetah posiadają jedną z najbardziej czytelnych i eleganckich składni. Autorzy wzorowali się trochę na javowych Velocity i Webmacro. Tym, którzy cenią sobie czystość Pythona z prostotą składni szablonów z pewnością Cheetah mogą przypaść do gustu. Przez dłuższy czas były moimi ulubionymi szablonami i do te pory lubię ich klarowność. Cheetah posiadają elegancką składnię obiektowego budowania szablonów potomnych na bazie już istniejących. Myghty też to potrafi, ale Cheetah to ma bardzo czytelnie zrobione. Cheetah są również bardzo szybkie.

Mako

Mako to najmłodsze dziecko stworzone przez programistów Pylonsów. Powstały na bazie doświadczeń i najlepszych cech szablonów Myghty, Cheetah, Django/Jinja czy Smarty. Największą ich zaletą jest ogromna szybkość i pythonowa filozofia pracy. Programiści Pythona mogą zauważyć, że składnia Mako jest bardzo bliska sposobowi pracy w samym języku Python. Mako posiadają wielką łatwość tworzenia komponentów, ale w sposób bardzo podobny do tego jak Python wykorzystuje swoje moduły. Szablony można także rozszerzać na drodze obiektowego dziedziczenia. Dziedziczenie szablonów może być określane w sposób dynamiczny (tego już nie potrafią np. Cheetah). Dowolny fragment szablonu można również zamienić na komponent z własnym cache. Mako posiadają także składnię modyfikatorów, które spopularyzowane zostały przez Smarty. Działają one jak uniksowe pipes (${zmienna|filter}.

Mako automatycznie kompilują swój kod do modułów Pythona. Można je więc debugować tak jak zwykły kod Pythona (Cheeatah wymaga ręcznej kompilacji). Można je bez problemu używać jako niezależną bibliotekę. Nie są one zależne od jakiegokolwiek frameworku. Można je zintegrować z dowolnym frameworkiem używającym standardu³ WSGI. Użytkownicy frameworka Pylons prawie nic nie muszą robić, bo Mako są już tam przygotowane do pracy.

Ogólnie rzecz biorąc, Mako to – moim zdaniem – najlepszy aktualnie istniejący system szablonów dla Pythona.

Zaś co do frameworków… to coraz bardziej zaczynam nabierać pewności, że przyszłość nie należy ani do Django, ani do Railsów. Nic nie może równać się z możliwościami czystego, 100% frameworka WSGI. Takim jest np. Pylons. Ale o tym, i o “bitwie” Pylons vs. Django i Rails, napiszę już innym razem.

Appendix 2007-01-29: Zobacz też szablony Haml .

¹ Poprawnie rzecz mówiąc, powinien napisać swojego helpera. Jeśli więc chcemy wyświetlić w pętli rekordy z bazy, a widok jest czuły na zawartość tych danych, to powinniśmy cała listę rekordów wrzucić do helplera, przeiterować w pętli, dodać dodatkową zmienną i dopiero tak zmodyfikowaną listę przekazać do szablonu.

² Smarty mimo posiadania własnej składni pozwala na odpalanie pełnego języka PHP: {php}print phpinfo();{/php}. Tak praktyka jest jednak odradzana, bo wprowadza jeszcze większy bałagan niż już jest w PHP.

³ Zobacz artykuł Introducing WSGI: Python’s Secret Web Weapon oraz prezentację koncepcji WSGI na video.

Szablony i wzorzec MVC - cz. II

Jarosław Zabiełło — Sat, 06 Jan 2007 11:35:00 +0100

W pierwszej części wyjasniono czym jest wzorzec MVC, szablony i helpery. Pora na przyjrzenie się szablonom.

Jednym z najważniejszych kryteriów, jest podział “programista czy designer” – ma on duży wpływ na to, dla kogo szablony będą proste a dla kogo – uciążliwe czy złożone. Tzn. czy szablonami będą zajmować się programiści czy też klasyczni web designerzy nie posiadający specjalnie dużej wiedzy o programowaniu? W wypadku designera, szablony posługujące się pełnym językiem programowania mogą być nie lada wyzwaniem. Przeciętny designer posługuje się Dreamweaverem i najchętniej w ogóle by nie chciał programować. A jeśli już, to tylko w zakresie jaki jest mu potrzebny do pracy nad szablonem.

Jeśli zatem mamy zarówno zespół programistów jak i takich designerów, i o nie chcemy aby programiści musieli wszystkim się zajmować, warto wybrać taki rodzaj szablonów, który mógłby być “przyswajalny” dla designerów.

Szablony zgodne z XML.

Najbardziej skrajnym przypadkiem jest użycie takich szablonów, które są “przezroczyste” dla edytorów wizualnie wspomagających projektowanie kodu HTML, np. Dreamweaver. W tym wypadku designer przygotowuje statyczne pliki HTML za pomocą takiego edytora i oddaje go programistom aby wtłoczyli w nie życie – czyli dynamikę kodu wykonywalnego po stronie serwera.

Szablony tego typo są w 100% zgodne z XML. Logika skryptu jest zaś sprytnie ukryta w dodatkowych atrybutach tagów HTML (mówi się tu o TAL czyli tag attribute language – język atrybutów znaczników) Kod zawarty w atrybutach tagów jest ignorowany przez Dreamweavera.

Tego typu szablony, choć są wygodne dla designerów (nic nie muszą dodatkowo robić) są dosyć uciążliwe dla programistów. Są w praktyce bardziej skomplikowane niż te, które dają możliwość użycia pełnego języka. Problemem jest też trudność w generowaniu za pomocą takich szablonów kodu niezgodnego z XML, np. CSS (styli kaskadowych) . Zaletą jednak jest to, że jakakolwiek potrzeba poprawy layoutu sprowadza się do podrzucenia plików designerom. Dreamveaver nie jest w stanie zniszczyć logiki jaką pracowicie programiści dodali do atrybutów HTML. Nie trzeba na nowo za każdym razem jej dodawać.

Python

ZPT (Zope Page Templates) – szablony używane przez serwer aplikacji Zope.
SimpleTAL – tak jak ZPT, ale działające jako niezależna biblioteka, można je używać bez potrzeby instalacji Zope.
Kid – szablony wzorowane też na ZPT ale atrybuty wykorzystują składnię XSLT. Można też tworzyć kolejne szablony na drodze obiektowego dziedziczenia.
Genshi – najlepsze w swej klasie. Wzorowane na XSLT (np. można używać XPath) i szablonach Kid. Genshi potrafi kod XML jak i nie-XML. Zostały pierwotnie stworzone dla doskonałego Traca (który aktualnie migruje z szablonów ClearSilver do Genshi).

Ruby

MasterView – ciekawe szablony dla Ruby i Railsów. Wykorzystują pełną moc i produktywność Railsów włącznie z szablonami wzorcowymi (layouts), podszablonami (partials) oraz masą helperów jakimi dysponuje Rails. Równocześnie są przezroczyste dla Dreamweavera, więc nadają się doskonale dla designerów operujących tego typu edytorem.

PHP

PHP TAL jest pehapową implementacją pythonowych ZPT. Jak widać szablony używane w Zope jest źródłem inspiracji dla całej reszty. :)

Szablony uniwersalne (z uproszczonym językiem)

Jeśli nie mamy do czynienia z grupą designerów bojących się dotykać kodu, można pokusić się o użycie szablonów wykorzystujących uproszczony język programowania.

PHP

Przykładem najlepszych szablonów w tej klasie dla PHP są Smarty. Posiadają dosyć wygodną składnię z może jednym wyjątkiem. Domyślne ustawienia dla wstawek kodu wykorzystują dosyć niefortunnie klamry. Sprawia to potem problem dla JavaScript. Na szczęście można to przedefiniować. Poza tym Smarty oferują bardzo wygodne modyfikatory który niczym uniksowe kaskady pipes filtrują zawartość zmiennej: {$zmienna|filtr1|filtr2}. Mają też własny cache (choć oparty tylko na systemie plików) Można też tworzyć własne komponenty(choć w ograniczonym zakresie, np. trudno je iterować w pętli z powodu kolizji nazw – PHP posiada tylko jedną, płaską przestrzeń nazw dla wszystkich funkcji)

Python

Bardzo dobrym przykładem szablonów które można by dać designerom do ręki są szablony używane we frameworku Django. Korzystają one z elementów Smarty i pythonowego Cheetah. Posiadają swoją składnię, ale bardzo prostą i wygodny sposób tworzenia kolejnych szablonów na bazie już istniejących. Tzw. w szablonach Smarty kolejne szablony są tworzone za pomocą cięcia i sklejania kawałków kodu (pliki z szablonami można “includować” do większej całości). W Django można to zrobić także na drodze obiektowego dziedziczenia. Twórcy Django wyciągnęli też lekcję ze Smartów i używają dwóch klamr, zamiast jednej, co nie powoduje kolizji z kodem JavaScript.

base.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <link rel="stylesheet" href="style.css" />
    <title>{% block title %}szablon bazowy{% endblock %}</title>
  </head>
  <body>
  {% block content %}treść szablonu bazowego{% endblock %}
</html>

example.html

{% extends "base.html" %}
{% block title %}Szablon  example.html{% endblock %}
{% block content %}
    <h1>{{ section.title }}</h1>
    {% for story in story_list %}
    <h2>
      <a href="{{ story.get_absolute_url }}">
      {{ story.headline|upper }}
      </a>
    </h2>
    <p>{{ story.tease|truncatewords:"100" }}</p>
   {% endfor %}
{% endblock %}

Szablony Django doczekały się swoich następców/naśladowców.

Jinja to szablony implementujące funkcjonalność Django, ale nie są związane z samym frameworkiem. Stanowią oddzielną bibliotekę którą można używać w dowolnym kodzie Pythona. Łatwo je włączyć np. do Pylonsów.

Ruby

Liquid – implementacja szablonów Django w języku Ruby. Można je używać np. we frameworku Rails. Nie posiadają wszystkich djangowych cech, m.in. najważniejszej – obiektowości. Nie posiadają też wszystkich helperów jakie są w Django. Jednak pozwalają na używanie ich razem z szablonami standardowymi – ERb.

O kolejnej (w wypadku Pythona – najliczniejszej) grupie szablonów pozwalającej na pełny dostęp do języka będzie w następnej części. Dają one pełny komfort programistom klnącym na ograniczenia szablonów używających swoich własnych języków.

Szablony i wzorzec MVC

Jarosław Zabiełło — Wed, 03 Jan 2007 20:30:00 +0100

Wzorzec MVC

MVC to skrót od ang. Model – View – Controller (czyli Model – Widok – Kontroler). Jest to jeden z popularniejszych wzorców projektowych (czy “wzorców architektonicznych w oprogramowanu” jak się mogą czepiać niektórzy puryści) W uproszczeniu, wzorce projektowe to standardowe, sprawdzone rozwiązania dla typowych problemów programistycznych (głównie dotyczą programowania obiektowego). Ich przeciwieństwem są anty-wzorce, czyli to, jak nie należy programować. Typowym antywzorcem jest spaghetti-code, wymieszanie logiki biznesowej z warstwą prezentacji, wszystkiego razem w jednym śmietniku. To typowy styl programowania większości niedoświadczonych programistów PHP.

W skrócie, wzorzec MVC polega na takim podziale kodu, aby składał się z trzech, funkcjonalnie oddzielnych części.

Model

Modelem nazywamy tą część kodu aplikacji, która jest odpowiedzialna za kontakt z danymi biznesowymi, gdziekolwiek są składowane (zwykle w relacyjnej bazie danych). Model nie tylko służy do pobierania i modyfikacji danych biznesowych, ale także zajmuje się ich spójnością i integralnością poprzez odpowiednie mechanizmy walidacji danych. Model służy więc za zarówno strażnika jak i dysponenta danych biznesowych. Bardzo elegancko widać to w Ruby on Rails gdzie przykładowy kod pełniący rolę modelu wyglądać może tak:

class Project < ActiveRecord::Base
  belongs_to :portfolio
  has_one :project_manager
  has_many :milestones
  has_many :deliverables, :through => :milestones

  validates_presence_of :name, :description
  validates_acceptance_of :non_disclosure_agreement
  validates_uniqueness_of :short_name
end

Widok

Widok służy do generowania tego, co moglibyśmy określić jako prezentację naszej aplikacji. Przy czym nie jest określone jak ta prezentacja ma wyglądać. Ogólnie prezentacją jest to wszystko, co aplikacja “wypluwa” na zewnątrz. Nie musi to być żaden “interfejs użytkownika” jak wypisują bzdury co niektórzy. Model MVC nie zakłada przecież tego, kto ma być odbiornikiem wysyłanego strumiena danych. Może to być zarówno pani Genowefa miotająca się po internecie za pomocą Internet Explodera jak i rozbudowany czytnik kanałów RSS, albo jakieś dowolne urządzenie odbierające generowany strumień danych (w tym ostatnim wypadku nie musi to być w ogóle aplikacja webowa) Generowany strumień danych nie musi być w ogóle żadnym tekstem. Mogą to być bowiem równie dobrze strumień danych binarnych.

Zresztą tak właśnie działają aplikacje webowe, które działają wg zasady client-server. Tzn. klient wysyła żądanie, a serwer odpowiada. Przeglądarka Iinternetowa wysyła żądanie do serwera WWW, a on odpowiada jej strumieniem danych. (w wypadku aplikacji webowych serwer wysyła wpierw tekst z nagłówkiem informującym co będzie wysyłane, bo to wynika z zasad protokołu HTTP).

BTW, z tego wynika ważna lekcja odnośnie adresów URL. To co wklepujemy w przeglądarce nie musi mieć żadnego związku z jakimikolwiek ścieżkami na serwerze. Wszystkie technologie, używające jawnych rozszerzeń plików (.asp, .php, .jsp, .aspx itp) są głupie, bo po pierwsze, sugerują że to coś w adresie z końcówką .php to zawsze jest konkretny plik po konkretnym katalogu. Po drugie, bez sensu eksponują użytą technologię, co wiąże trochę ręce tym, którzy by chcieli zmienić wewnetrzny system generujący strony WWW ale bez ruszania starych adresów URL. Po trzecie, spidery takie jak Google nie lubią indeksować stron generowanych dynamiczne. Jeśli zobaczą w adresie znak zapytania to najczęściej to, co za nim stoi jest ignorowane. Odbija sie to na “pozycjonowaniu” tak napisanej aplikacji. I po czwarte takie adresy (z rozszerzeniami i parametrami po znaku zapytania) są najzwyczajniej brzydkie i trudne do zapamiętania. Nie znaczy to, że tak (/?x=1&y=2&z=4)w ogóle nie przekazywać parametrów. Chodzi tylko o to, aby to robić to oszczędnie i tylko wtedy, kiedy jest to naprawdę koniecznie.

Kontroler

Kod, który spina wszystko razem i stanowi serce aplikacji to kontroler. To on pobiera dane z bazy za pomocą modelu i to on wybrane dane wysyła do widoku aby je jakoś zaprezentował dla odbiorcy. Kontroler także dba o takie kwestie jak autoryzacja i autentykacja użytkowników (określa kto może mieć dostęp do poszczególnych części aplikacji). Kontroler zajmuje się też sposobem przepływu danych zgodnie z potrzebami logiki biznesowej.

Szablony i Helpery

Czym są szablony? Szablony przynależą do warstwy Widoku wzorca MVC. Otrzymują dane z kontrolera i na tej podstawie generują kod HTML jaki jest wysyłany do przeglądarki. Szablony powinny być raczej proste tak, aby można było łatwo modyfikować sposób prezentacji bez godzin ślęczenia nad kodem. Najczęściej kwestią prezentacji zajmują się różnej maści webmasterzy i designerzy, czyli ogólniej osoby, które niekoniecznie są zaawansowanymi programistami.

W wypadku kiedy sposób prezentacji jest złożony, aby nie komplikować szablonu stosuje się do pomocy… pomocnika ;) Głównym zadaniem helpera jest takie wstepne przetworzenie danych (jakie kontroler wrzucił do szablonu) aby szablon mogący je wyświetlić był jak najprostszy i jak najbardziej czytelny. Helper dane pobiera od szablonu, modyfikuje je i odsyła je z powrotem. Dzięki temu logika niezbędna do wygenerowania prezentacji jest w szablonie znacznie uproszczona.

Szablony można podzielić na kilka rodzajów, stosownie do oczekiwanych od nich funkcji. Ale o tym (i o strategii wyboru właściwych szablonów) już w drugiej części.