SlideShare ist ein Scribd-Unternehmen logo
1 von 32
Downloaden Sie, um offline zu lesen
Fanstatic
Was es kann (und können sollte?)
Ich

• Daniel Havlik
• Mitinhaber und Entwickler bei gocept gmbh
  & co. kg
• Python seit 2002, hauptsächlich im Web-
  Umfeld
Fanstatic

• https://bitbucket.org/fanstatic
• hurry.resource; zc.resourcelibrary
• Martijn Faassen, Jan-Jaap Driessen
Inhalt

• Einführung
• Features
• Zukunft
Um was geht es?

• Einbinden statischer Ressourcen in
  Webapplikationen
• JS
• CSS
Welche Möglichkeiten
      gibt es?

• Ins Template schreiben
• Plone…
• an der *richtigen* Stelle!
zum Beispiel
class DateTimeWidgetView(object):
    def render(self):
        my.datetimewidget.resource.widget_js.need()
        return self.template()



• need()
• Wie kommt das jetzt ins HTML?
• „Injector“:
 • Einsammeln aller „needed Resources“
 • Injizieren in HTML
 • WSGI-Middleware, diverse
    Konfigurationsoptionen
Libraries
lib = fanstatic.Library('my.dtw', 'resources')




• -> http://host/static/my.dtw/foo.js
• -> my.dtw/src/my/dtw/resources/foo.js
Ressourcen
• resource.py
    widget_js = fanstatic.Resource(
        lib,
        'foo.js',
        minified='foo.min.js',
        depends=[js.jquery, widget_css])
Features
• Bundling
• Gruppierung
• Renderer
• Versioning
• Slots
• minifizierte Resourcen
Bundling


• Ausliefern mehrerer Resourcen in einem
  Request
• Ein Bundle pro Library & Verzeichnis
Gruppierung

jquery = fanstatic.Group([
    js.jquery,
    js.jquery.jqueryui,
    my_magic_jquery_patch])
Renderer
   <script src="/static/my.lib/script.js" type="text/javascript" />



<link href="/static/my.lib/style.css" rel="stylesheet" type="text/css" />
custom Renderer
def lte_ie8_renderer(url):
    inner = fanstatic.core.render_css(url)
    return "<!--[if lte IE 8]>%s<![endif]-->" % inner


iehacks_css = fanstatic.Resource(
    lib, 'css/iehacks.css',
    renderer=lte_ie8_renderer)
custom Renderer 2
 def media_print(url):
     return ('<link href="%s" rel="stylesheet"'
             '      type="text/css" media="print"/>') % url


 print_styles = fanstatic.Resource(
     lib, 'css/print.css',
     renderer=media_print)




(…oder einfach @media print {})
Versioning
• Problem: Auf (Browser)cache ist kein
  Verlass.
• Versions-Identifier in der URL
• „Cache forever“
<script src="/static/my.lib:version:<HASH>/script.js"
        type="text/javascript" />
Slots
• Resource, die zur Laufzeit / in der
  Applikationslogik befüllt wird.

      templating = fanstatic.Slot(
          lib, '.js', required=True)

      framework = fanstatic.Resource(
          lib, 'fancy_framework.js',
          depends=[templating])
Slots
framework.need(dict(templating=js.pure))

framework.need(dict(templating=js.ejs))

framework.need()

"SlotError: slot <fanstatic.core.Slot object at …> was
required but not filled in"
minifizierte Resourcen

• müssen angegeben werden
• Fallstrick: jsmin vergessen
• Test hilft (manchmal)!
Zukunft

• Preprocessing
• Slot mit default
• (Python 3)
Preprocessing

• Anwendungsideen
 • CoffeeScript
 • SCSS/LessCSS
 • jsmin
Preprocessing

• Wo soll das Processing stattfinden?
 • Release
 • Build
 • Laufzeit
Preprocessing

• Release:
 • + Konverter nicht notwendig für
    „Anwender“
 • - Für Entwickler nicht machbar
Preprocessing

• Build
 • - „Anwender“ braucht Konverter (pip)
 • +/-0 Code-Änderungen erst nach rebuild
    nutzbar.
Preprocessing

• Laufzeit
 • + Änderungen werden sofort wirksam
 • - Caching, Last
Slot mit default


• Für required slots, wenn beim need keine
  Resource angegeben wird.
Python 3

• noch warm
Vielen Dank!


• Sprint, Freitag und Samstag vormittag.
• Fragen?

Weitere ähnliche Inhalte

Was ist angesagt?

Schau, Mutti, keine Programmierzeile
Schau, Mutti, keine ProgrammierzeileSchau, Mutti, keine Programmierzeile
Schau, Mutti, keine Programmierzeilerokr
 
Andy bosch-jsf-javascript
Andy bosch-jsf-javascriptAndy bosch-jsf-javascript
Andy bosch-jsf-javascriptAndy Bosch
 
Schöne neue Welt von HTML5 - WebTech 2010 Mainz 12.10.2010
Schöne neue Welt von HTML5 - WebTech 2010 Mainz 12.10.2010Schöne neue Welt von HTML5 - WebTech 2010 Mainz 12.10.2010
Schöne neue Welt von HTML5 - WebTech 2010 Mainz 12.10.2010Patrick Lauke
 
Nooku, Molajo & Co - Joomla! Distributionen. Oder Forks.
Nooku, Molajo & Co - Joomla! Distributionen. Oder Forks.Nooku, Molajo & Co - Joomla! Distributionen. Oder Forks.
Nooku, Molajo & Co - Joomla! Distributionen. Oder Forks.David Jardin
 
MVC 1.0: Zeitgemäße Webanwendungen in JavaEE
MVC 1.0: Zeitgemäße Webanwendungen in JavaEEMVC 1.0: Zeitgemäße Webanwendungen in JavaEE
MVC 1.0: Zeitgemäße Webanwendungen in JavaEEOPEN KNOWLEDGE GmbH
 
OSMC 2012 | End2End-Monitoring von Webapplikationen mit SAHI by Simon Meggle
OSMC 2012 | End2End-Monitoring von Webapplikationen mit SAHI by Simon MeggleOSMC 2012 | End2End-Monitoring von Webapplikationen mit SAHI by Simon Meggle
OSMC 2012 | End2End-Monitoring von Webapplikationen mit SAHI by Simon MeggleNETWAYS
 
WordPress Multisite
WordPress MultisiteWordPress Multisite
WordPress MultisiteWalter Ebert
 
Wordpress Benutzerrollen und Eigenschaften
Wordpress Benutzerrollen und EigenschaftenWordpress Benutzerrollen und Eigenschaften
Wordpress Benutzerrollen und Eigenschaftenfrankstaude
 
Go Fullstack: Webanwendungen mit Java EE 6 bauen (W-JAX 2011)
Go Fullstack: Webanwendungen mit Java EE 6 bauen (W-JAX 2011)Go Fullstack: Webanwendungen mit Java EE 6 bauen (W-JAX 2011)
Go Fullstack: Webanwendungen mit Java EE 6 bauen (W-JAX 2011)Michael Kurz
 
Microsoft Azure Platform - System Management v.0.5
Microsoft Azure Platform -  System Management v.0.5 Microsoft Azure Platform -  System Management v.0.5
Microsoft Azure Platform - System Management v.0.5 Oliver Michalski
 
Ruby on Rails in a metro session
Ruby on Rails in a metro sessionRuby on Rails in a metro session
Ruby on Rails in a metro sessionVirttoo org
 

Was ist angesagt? (14)

Schau, Mutti, keine Programmierzeile
Schau, Mutti, keine ProgrammierzeileSchau, Mutti, keine Programmierzeile
Schau, Mutti, keine Programmierzeile
 
Pimcore
PimcorePimcore
Pimcore
 
node.js
node.jsnode.js
node.js
 
Andy bosch-jsf-javascript
Andy bosch-jsf-javascriptAndy bosch-jsf-javascript
Andy bosch-jsf-javascript
 
Schöne neue Welt von HTML5 - WebTech 2010 Mainz 12.10.2010
Schöne neue Welt von HTML5 - WebTech 2010 Mainz 12.10.2010Schöne neue Welt von HTML5 - WebTech 2010 Mainz 12.10.2010
Schöne neue Welt von HTML5 - WebTech 2010 Mainz 12.10.2010
 
Nooku, Molajo & Co - Joomla! Distributionen. Oder Forks.
Nooku, Molajo & Co - Joomla! Distributionen. Oder Forks.Nooku, Molajo & Co - Joomla! Distributionen. Oder Forks.
Nooku, Molajo & Co - Joomla! Distributionen. Oder Forks.
 
Node.js für Webapplikationen
Node.js für WebapplikationenNode.js für Webapplikationen
Node.js für Webapplikationen
 
MVC 1.0: Zeitgemäße Webanwendungen in JavaEE
MVC 1.0: Zeitgemäße Webanwendungen in JavaEEMVC 1.0: Zeitgemäße Webanwendungen in JavaEE
MVC 1.0: Zeitgemäße Webanwendungen in JavaEE
 
OSMC 2012 | End2End-Monitoring von Webapplikationen mit SAHI by Simon Meggle
OSMC 2012 | End2End-Monitoring von Webapplikationen mit SAHI by Simon MeggleOSMC 2012 | End2End-Monitoring von Webapplikationen mit SAHI by Simon Meggle
OSMC 2012 | End2End-Monitoring von Webapplikationen mit SAHI by Simon Meggle
 
WordPress Multisite
WordPress MultisiteWordPress Multisite
WordPress Multisite
 
Wordpress Benutzerrollen und Eigenschaften
Wordpress Benutzerrollen und EigenschaftenWordpress Benutzerrollen und Eigenschaften
Wordpress Benutzerrollen und Eigenschaften
 
Go Fullstack: Webanwendungen mit Java EE 6 bauen (W-JAX 2011)
Go Fullstack: Webanwendungen mit Java EE 6 bauen (W-JAX 2011)Go Fullstack: Webanwendungen mit Java EE 6 bauen (W-JAX 2011)
Go Fullstack: Webanwendungen mit Java EE 6 bauen (W-JAX 2011)
 
Microsoft Azure Platform - System Management v.0.5
Microsoft Azure Platform -  System Management v.0.5 Microsoft Azure Platform -  System Management v.0.5
Microsoft Azure Platform - System Management v.0.5
 
Ruby on Rails in a metro session
Ruby on Rails in a metro sessionRuby on Rails in a metro session
Ruby on Rails in a metro session
 

Andere mochten auch

Copyright and fair use
Copyright and fair useCopyright and fair use
Copyright and fair usetrbeattie13
 
Superbaby
SuperbabySuperbaby
Superbabypappzsm
 
01.11.12 partner presentation christmas 2012
01.11.12 partner presentation christmas 201201.11.12 partner presentation christmas 2012
01.11.12 partner presentation christmas 2012IFA Member Services
 
Máquina de Turing reconhecedora de número primo
Máquina de Turing reconhecedora de número primoMáquina de Turing reconhecedora de número primo
Máquina de Turing reconhecedora de número primoDiego Cavalca
 
Twitter bis
Twitter bisTwitter bis
Twitter bisOiknineC
 
Diapositiva tulmo edwin
Diapositiva tulmo edwinDiapositiva tulmo edwin
Diapositiva tulmo edwinedwintulmo
 
cambiar el aceite a un motor
cambiar el aceite a un motorcambiar el aceite a un motor
cambiar el aceite a un motorrafea1234
 
How to change the oil in your car
How to change the oil in your carHow to change the oil in your car
How to change the oil in your carrafea1234
 

Andere mochten auch (12)

Ethan McCarthy
Ethan McCarthyEthan McCarthy
Ethan McCarthy
 
Copyright and fair use
Copyright and fair useCopyright and fair use
Copyright and fair use
 
Superbaby
SuperbabySuperbaby
Superbaby
 
01.11.12 partner presentation christmas 2012
01.11.12 partner presentation christmas 201201.11.12 partner presentation christmas 2012
01.11.12 partner presentation christmas 2012
 
Máquina de Turing reconhecedora de número primo
Máquina de Turing reconhecedora de número primoMáquina de Turing reconhecedora de número primo
Máquina de Turing reconhecedora de número primo
 
Twitter bis
Twitter bisTwitter bis
Twitter bis
 
Diapositiva tulmo edwin
Diapositiva tulmo edwinDiapositiva tulmo edwin
Diapositiva tulmo edwin
 
cambiar el aceite a un motor
cambiar el aceite a un motorcambiar el aceite a un motor
cambiar el aceite a un motor
 
Tedx
TedxTedx
Tedx
 
How to change the oil in your car
How to change the oil in your carHow to change the oil in your car
How to change the oil in your car
 
Lectura rápida
Lectura rápidaLectura rápida
Lectura rápida
 
How php works
How php worksHow php works
How php works
 

Ähnlich wie Fanstatic pycon.de 2012

Effiziente datenpersistierung mit JPA 2.1 und Hibernate
Effiziente datenpersistierung mit JPA 2.1 und HibernateEffiziente datenpersistierung mit JPA 2.1 und Hibernate
Effiziente datenpersistierung mit JPA 2.1 und HibernateThorben Janssen
 
Was kommt nach den SPAs
Was kommt nach den SPAsWas kommt nach den SPAs
Was kommt nach den SPAsQAware GmbH
 
Eigene Themes from Scratch
Eigene Themes from ScratchEigene Themes from Scratch
Eigene Themes from ScratchStefan Fröhlich
 
Schnelle Winkel: 10x schnellere Webapps mit AngularJS und JEE
Schnelle Winkel: 10x schnellere Webapps mit AngularJS und JEESchnelle Winkel: 10x schnellere Webapps mit AngularJS und JEE
Schnelle Winkel: 10x schnellere Webapps mit AngularJS und JEEBenjamin Schmid
 
SEO Day 2016: Perfekte Ladezeiten und SEO-Hosting für Speed-Freaks
SEO Day 2016: Perfekte Ladezeiten und SEO-Hosting für Speed-FreaksSEO Day 2016: Perfekte Ladezeiten und SEO-Hosting für Speed-Freaks
SEO Day 2016: Perfekte Ladezeiten und SEO-Hosting für Speed-FreaksSEARCH ONE
 
Automatischer Build mit Maven - OPITZ CONSULTING - Stefan Scheidt
Automatischer Build mit Maven - OPITZ CONSULTING - Stefan ScheidtAutomatischer Build mit Maven - OPITZ CONSULTING - Stefan Scheidt
Automatischer Build mit Maven - OPITZ CONSULTING - Stefan ScheidtOPITZ CONSULTING Deutschland
 
Rufen Sie nicht an – wir rufen Sie an! | Server-sent Events und Web-Sockets i...
Rufen Sie nicht an – wir rufen Sie an! | Server-sent Events und Web-Sockets i...Rufen Sie nicht an – wir rufen Sie an! | Server-sent Events und Web-Sockets i...
Rufen Sie nicht an – wir rufen Sie an! | Server-sent Events und Web-Sockets i...OPEN KNOWLEDGE GmbH
 
Grails im Überblick und in der Praxis
Grails im Überblick und in der PraxisGrails im Überblick und in der Praxis
Grails im Überblick und in der PraxisTobias Kraft
 
Perl Renaissance Reloaded
Perl Renaissance ReloadedPerl Renaissance Reloaded
Perl Renaissance ReloadedGregor Goldbach
 
Collaboration Days 2011 - Damit die Tester schneller ran können.
Collaboration Days 2011 - Damit die Tester schneller ran können.Collaboration Days 2011 - Damit die Tester schneller ran können.
Collaboration Days 2011 - Damit die Tester schneller ran können.David Schneider
 
ColdFusion im Enterprise Umfeld - Deep Dive
ColdFusion im Enterprise Umfeld - Deep DiveColdFusion im Enterprise Umfeld - Deep Dive
ColdFusion im Enterprise Umfeld - Deep DiveBokowsky + Laymann GmbH
 
Automatischer Build mit Maven
Automatischer Build mit MavenAutomatischer Build mit Maven
Automatischer Build mit MavenStefan Scheidt
 
PrettyFaces: RESTful URLs für JSF
PrettyFaces: RESTful URLs für JSFPrettyFaces: RESTful URLs für JSF
PrettyFaces: RESTful URLs für JSFChristian Kaltepoth
 

Ähnlich wie Fanstatic pycon.de 2012 (20)

Effiziente datenpersistierung mit JPA 2.1 und Hibernate
Effiziente datenpersistierung mit JPA 2.1 und HibernateEffiziente datenpersistierung mit JPA 2.1 und Hibernate
Effiziente datenpersistierung mit JPA 2.1 und Hibernate
 
Was kommt nach den SPAs
Was kommt nach den SPAsWas kommt nach den SPAs
Was kommt nach den SPAs
 
Node.js
Node.jsNode.js
Node.js
 
JavaScript Performance
JavaScript PerformanceJavaScript Performance
JavaScript Performance
 
Eigene Themes from Scratch
Eigene Themes from ScratchEigene Themes from Scratch
Eigene Themes from Scratch
 
XPages: Performance-Optimierung - Ulrich Krause (eknori) SNoUG 2013
XPages: Performance-Optimierung  - Ulrich Krause (eknori) SNoUG 2013XPages: Performance-Optimierung  - Ulrich Krause (eknori) SNoUG 2013
XPages: Performance-Optimierung - Ulrich Krause (eknori) SNoUG 2013
 
JSF vs. GWT? JSF und GWT!
JSF vs. GWT? JSF und GWT!JSF vs. GWT? JSF und GWT!
JSF vs. GWT? JSF und GWT!
 
Hdc2012 cordova-präsi
Hdc2012 cordova-präsiHdc2012 cordova-präsi
Hdc2012 cordova-präsi
 
Schnelle Winkel: 10x schnellere Webapps mit AngularJS und JEE
Schnelle Winkel: 10x schnellere Webapps mit AngularJS und JEESchnelle Winkel: 10x schnellere Webapps mit AngularJS und JEE
Schnelle Winkel: 10x schnellere Webapps mit AngularJS und JEE
 
JavaScript Performance
JavaScript PerformanceJavaScript Performance
JavaScript Performance
 
SEO Day 2016: Perfekte Ladezeiten und SEO-Hosting für Speed-Freaks
SEO Day 2016: Perfekte Ladezeiten und SEO-Hosting für Speed-FreaksSEO Day 2016: Perfekte Ladezeiten und SEO-Hosting für Speed-Freaks
SEO Day 2016: Perfekte Ladezeiten und SEO-Hosting für Speed-Freaks
 
Automatischer Build mit Maven - OPITZ CONSULTING - Stefan Scheidt
Automatischer Build mit Maven - OPITZ CONSULTING - Stefan ScheidtAutomatischer Build mit Maven - OPITZ CONSULTING - Stefan Scheidt
Automatischer Build mit Maven - OPITZ CONSULTING - Stefan Scheidt
 
Rufen Sie nicht an – wir rufen Sie an! | Server-sent Events und Web-Sockets i...
Rufen Sie nicht an – wir rufen Sie an! | Server-sent Events und Web-Sockets i...Rufen Sie nicht an – wir rufen Sie an! | Server-sent Events und Web-Sockets i...
Rufen Sie nicht an – wir rufen Sie an! | Server-sent Events und Web-Sockets i...
 
Grails im Überblick und in der Praxis
Grails im Überblick und in der PraxisGrails im Überblick und in der Praxis
Grails im Überblick und in der Praxis
 
Perl Renaissance Reloaded
Perl Renaissance ReloadedPerl Renaissance Reloaded
Perl Renaissance Reloaded
 
Collaboration Days 2011 - Damit die Tester schneller ran können.
Collaboration Days 2011 - Damit die Tester schneller ran können.Collaboration Days 2011 - Damit die Tester schneller ran können.
Collaboration Days 2011 - Damit die Tester schneller ran können.
 
Moderner Webentwicklungs-Workflow
Moderner Webentwicklungs-WorkflowModerner Webentwicklungs-Workflow
Moderner Webentwicklungs-Workflow
 
ColdFusion im Enterprise Umfeld - Deep Dive
ColdFusion im Enterprise Umfeld - Deep DiveColdFusion im Enterprise Umfeld - Deep Dive
ColdFusion im Enterprise Umfeld - Deep Dive
 
Automatischer Build mit Maven
Automatischer Build mit MavenAutomatischer Build mit Maven
Automatischer Build mit Maven
 
PrettyFaces: RESTful URLs für JSF
PrettyFaces: RESTful URLs für JSFPrettyFaces: RESTful URLs für JSF
PrettyFaces: RESTful URLs für JSF
 

Fanstatic pycon.de 2012