WEBSITE ADAPTATION & FORMATTING LAYER
   Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | D...
OVERVIEW

๏     Introduction
๏     Approach & architecture
๏     Practical information
๏     Usability
๏     Performance
๏...
MOBILE INTERNET TODAY


๏     Most CMSs deliver
      desktop-only websites

➡     Bad mobile browsing
      experience


...
CURRENT SOLUTIONS


                                                                         ๏     Template switchers
    ...
MISSION


๏     Develop a Joomla! extension that ...

      ๏    detects a mobile device
      ๏    performs device-specifi...
OVERVIEW

๏     Introduction
๏     Approach & architecture
๏     Practical information
๏     Usability
๏     Performance
๏...
APPROACH

         USE SIRUNA PLATFORM

USABILITY - PERFORMANCE - MODIFIABILITY




                   7
OPEN PLATFORM (AGPL)

                       ADVANCED DEVICE DETECTION
                      CONTENT ADAPTATION MODULE
   ...
MAIN SIRUNA FUNCTIONALITY

๏     Image adaptation (scaling, reduce file size, transcode...)

๏     Rearrange content

๏    ...
ORIGINAL SIRUNA USE
                                           Siruna                                                     ...
OUR APPROACH
                              Joomla! & WAFL                                                                 ...
JOOMLA! EXTENSIONS
๏   Component
    ๏   Only one per page
    ๏   Defines main content
๏   Module
    ๏   Complements cont...
WAFL EXTENSION STRUCTURE


๏     Main functionality plugin
๏     Admin panel component
๏     Basic mobile template

๏     ...
OVERVIEW

๏     Introduction
๏     Approach & architecture
๏     Practical information
๏     Usability
๏     Performance
๏...
TEAM

๏     Kristof Vandermeeren - Project Manager
๏     Robin Leblon - Configuration Manager
๏     Heiko Desruelle - Test ...
TESTING

๏     2 test managers
๏     phpUnderControl
๏     Joomla! testing framework
๏     Types
      ๏    Unit
      ๏  ...
COVERAGE & METRICS




                                                                    17
Heiko Desruelle | Stijn De V...
OVERVIEW

๏     Introduction
๏     Approach & architecture
๏     Practical information
๏     Usability
๏     Performance
๏...
EASY INSTALLATION


๏     WAFL Joomla! extension == 6 parts
๏     “One-zip-upload”
๏     Plug-and-play
๏     Uncluttered a...
FEATURE LIST

๏     3 modes of operation
      ๏    Template switching
      ๏    Mobile redirect
      ๏    Siruna

๏    ...
OVERVIEW

๏     Introduction
๏     Approach & architecture
๏     Practical information
๏     Usability
๏     Performance
๏...
DEVICE DETECTION


๏     Bottleneck component : invoked every request
๏     Performance measures :
      ๏    Devices orga...
DEVICE DETECTION

๏     Detection time :
      ๏    Popular mobile device : <1 ms
      ๏    Less popular/desktop : 3 ms
๏...
PERFORMANCE TEST RESULTS
        REQUESTS/MINUTE - MORE IS BETTER
            MEASURED WITH JOOMLA! PROFILER - CHECKED WIT...
PERFORMANCE TEST RESULTS
        REQUESTS/MINUTE - MORE IS BETTER
            MEASURED WITH JOOMLA! PROFILER - CHECKED WIT...
PERFORMANCE TEST RESULTS
        REQUESTS/MINUTE - MORE IS BETTER


                                                      ...
PERFORMANCE TEST RESULTS
        REQUESTS/MINUTE - MORE IS BETTER


                                                      ...
CACHING SUPPORT


๏     Support Joomla! built-in cache
๏     Use context-aware cache handlers
๏     Injection via Joomla!’...
PERFORMANCE TEST RESULTS
    BANDWIDTH USAGE - LESS IS BETTER

                                         600 KB



        ...
PERFORMANCE TEST RESULTS
    BANDWIDTH USAGE - LESS IS BETTER

      544                                600 KB



        ...
PERFORMANCE TEST RESULTS
    BANDWIDTH USAGE - LESS IS BETTER

      544                                      600 KB

    ...
PERFORMANCE TEST RESULTS
    BANDWIDTH USAGE - LESS IS BETTER

      544                                      600 KB

    ...
OVERVIEW

๏     Introduction
๏     Approach & architecture
๏     Practical information
๏     Usability
๏     Performance
๏...
STRENGTHS


๏     Generic core functionality
๏     High performing implementation
๏     Easy install with “one-click-uploa...
FROM ALPHA TO BETA

๏     Further improvements :
     ๏   Improve layout mobile template (layout injection)
     ๏   Catch...
STANDALONE COMPONENTS


๏     Context-aware Joomla! cache
๏     Continuous integration environment for Joomla!
๏     Highl...
COMING UP...
๏     Next alpha release in 1 week ( June, 21)
      ๏    Safer installation
      ๏    Greatly improved layo...
MORE INFORMATION AT
                                                                      HTTP://WWW.WAFL.UGENT.BE
       ...
Upcoming SlideShare
Loading in …5
×

Website Adaptation & Formatting Layer

2,413 views

Published on

Presentation on Joomla!Days Netherlands by Kristof Vandermeeren & Robin Leblon

Published in: Technology, Education
0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
2,413
On SlideShare
0
From Embeds
0
Number of Embeds
91
Actions
Shares
0
Downloads
15
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide

Website Adaptation & Formatting Layer

  1. WEBSITE ADAPTATION & FORMATTING LAYER Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  2. OVERVIEW ๏ Introduction ๏ Approach & architecture ๏ Practical information ๏ Usability ๏ Performance ๏ Wrap up 2 Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  3. MOBILE INTERNET TODAY ๏ Most CMSs deliver desktop-only websites ➡ Bad mobile browsing experience 3 Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  4. CURRENT SOLUTIONS ๏ Template switchers ๏ Basic content adaptation ➡ Not user friendly ➡ Far from optimal 4 Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  5. MISSION ๏ Develop a Joomla! extension that ... ๏ detects a mobile device ๏ performs device-specific content adaptation ๏ is as generic as possible 5 Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  6. OVERVIEW ๏ Introduction ๏ Approach & architecture ๏ Practical information ๏ Usability ๏ Performance ๏ Wrap up 6 Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  7. APPROACH USE SIRUNA PLATFORM USABILITY - PERFORMANCE - MODIFIABILITY 7
  8. OPEN PLATFORM (AGPL) ADVANCED DEVICE DETECTION CONTENT ADAPTATION MODULE CONTENT FETCHING MODULE MORE INFO : HTTP://OPEN.SIRUNA.ORG 8 Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  9. MAIN SIRUNA FUNCTIONALITY ๏ Image adaptation (scaling, reduce file size, transcode...) ๏ Rearrange content ๏ Adapt the menu structure ๏ Replace JavaScript functionality ๏ Replace original advertisement banners by mobile advertisement banners 9 Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  10. ORIGINAL SIRUNA USE Siruna Website 1. Request page 2. Request page 3. Send page 4. Transform page 5. Deliver mobile page 10 Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  11. OUR APPROACH Joomla! & WAFL Siruna 1. Request page 2. Perform device detection 3. Send redirect 4. Request page 5. Request page 6. Generate mobile page 7. Send page 8. Transform page 9. Deliver mobile page 11 Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  12. JOOMLA! EXTENSIONS ๏ Component ๏ Only one per page ๏ Defines main content ๏ Module ๏ Complements content of a component ๏ Plugin ๏ Implements extra functionality ๏ Template 12 Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  13. WAFL EXTENSION STRUCTURE ๏ Main functionality plugin ๏ Admin panel component ๏ Basic mobile template ๏ Supporting module and 2 plugins ➡ Community can develop extra supporting modules/plugins 13 Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  14. OVERVIEW ๏ Introduction ๏ Approach & architecture ๏ Practical information ๏ Usability ๏ Performance ๏ Wrap up 14 Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  15. TEAM ๏ Kristof Vandermeeren - Project Manager ๏ Robin Leblon - Configuration Manager ๏ Heiko Desruelle - Test Manager ๏ Rob Vanden Meersche - Test Manager ๏ Stijn De Vos - Scribe & Documentation Manager ๏ Klaas Lauwers - Developer ๏ Mattias Poppe - Developer ๏ Daan Van Britsom - Developer 15 Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  16. TESTING ๏ 2 test managers ๏ phpUnderControl ๏ Joomla! testing framework ๏ Types ๏ Unit ๏ Integration ๏ Performance ๏ Acceptance 16 Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  17. COVERAGE & METRICS 17 Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  18. OVERVIEW ๏ Introduction ๏ Approach & architecture ๏ Practical information ๏ Usability ๏ Performance ๏ Wrap up 18 Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  19. EASY INSTALLATION ๏ WAFL Joomla! extension == 6 parts ๏ “One-zip-upload” ๏ Plug-and-play ๏ Uncluttered admin panel 19 Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  20. FEATURE LIST ๏ 3 modes of operation ๏ Template switching ๏ Mobile redirect ๏ Siruna ๏ Mobile template based on desktop template ๏ Delivered with basic Siruna mapping 20 Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  21. OVERVIEW ๏ Introduction ๏ Approach & architecture ๏ Practical information ๏ Usability ๏ Performance ๏ Modifiability 21 Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  22. DEVICE DETECTION ๏ Bottleneck component : invoked every request ๏ Performance measures : ๏ Devices organized according to popularity ๏ Can be disabled ๏ Different updateable data sources 22 Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  23. DEVICE DETECTION ๏ Detection time : ๏ Popular mobile device : <1 ms ๏ Less popular/desktop : 3 ms ๏ Typical Joomla! page request (no caching) : 500 ms ๏ Accuracy : ๏ 99 % of devices in WURFL (largest mobile device database) ๏ Typical PHP mobile detection : 80 % 23 Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  24. PERFORMANCE TEST RESULTS REQUESTS/MINUTE - MORE IS BETTER MEASURED WITH JOOMLA! PROFILER - CHECKED WITH JMETER WAFL disabled WAFL enabled - desktop WAFL enabled - mobile 24
  25. PERFORMANCE TEST RESULTS REQUESTS/MINUTE - MORE IS BETTER MEASURED WITH JOOMLA! PROFILER - CHECKED WITH JMETER 224 222 230 212 173 115 58 0 WAFL disabled WAFL enabled - desktop WAFL enabled - mobile 24
  26. PERFORMANCE TEST RESULTS REQUESTS/MINUTE - MORE IS BETTER 1.100 825 550 275 No caching Module caching 0 Page caching WAFL disabled WAFL enabled - desktop WAFL enabled - mobile 27
  27. PERFORMANCE TEST RESULTS REQUESTS/MINUTE - MORE IS BETTER 1.100 825 550 275 No caching Module caching 0 Page caching WAFL disabled WAFL enabled - desktop WAFL enabled - mobile 27
  28. CACHING SUPPORT ๏ Support Joomla! built-in cache ๏ Use context-aware cache handlers ๏ Injection via Joomla!’s flexible binding registry ๏ No core modifications needed ➡ Unprecedented feature! 28 Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  29. PERFORMANCE TEST RESULTS BANDWIDTH USAGE - LESS IS BETTER 600 KB 450 KB 300 KB 150 KB 0 KB WAFL disabled Template switching Siruna 29
  30. PERFORMANCE TEST RESULTS BANDWIDTH USAGE - LESS IS BETTER 544 600 KB 450 KB 300 KB 150 KB 0 KB WAFL disabled Template switching Siruna 29
  31. PERFORMANCE TEST RESULTS BANDWIDTH USAGE - LESS IS BETTER 544 600 KB 483 450 KB 300 KB 150 KB 0 KB WAFL disabled Template switching Siruna 29
  32. PERFORMANCE TEST RESULTS BANDWIDTH USAGE - LESS IS BETTER 544 600 KB 483 450 KB 300 KB 249 150 KB 0 KB WAFL disabled Template switching Siruna 29
  33. OVERVIEW ๏ Introduction ๏ Approach & architecture ๏ Practical information ๏ Usability ๏ Performance ๏ Wrap up 30 Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  34. STRENGTHS ๏ Generic core functionality ๏ High performing implementation ๏ Easy install with “one-click-upload” ๏ Very easy to use, no technical knowledge needed 31 Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  35. FROM ALPHA TO BETA ๏ Further improvements : ๏ Improve layout mobile template (layout injection) ๏ Catch device detection info from Siruna and use in template ๏ Speed up device detection for desktops (whitelist) ๏ Additional settings for mobile redirect ๏ Automagical Siruna configuration 32 Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  36. STANDALONE COMPONENTS ๏ Context-aware Joomla! cache ๏ Continuous integration environment for Joomla! ๏ Highly optimised device detection ➡ Very useful for the community 33 Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  37. COMING UP... ๏ Next alpha release in 1 week ( June, 21) ๏ Safer installation ๏ Greatly improved layout injection ๏ Last alpha before beta ๏ Compatible with latest open-source Siruna version ➡ Download at http://www.wafl.ugent.be ➡ Download Siruna at http://open.siruna.org 34 Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren
  38. MORE INFORMATION AT HTTP://WWW.WAFL.UGENT.BE HTTP://WWW.SIRUNA.COM CONTACT WAFL-TEAM AT HEIKO.DESRUELLE@UGENT.BE CONTACT SIRUNA AT FRANK.GIELEN@SIRUNA.COM Heiko Desruelle | Stijn De Vos | Klaas Lauwers | Robin Leblon | Mattias Poppe | Daan Van Britsom | Rob Vanden Meersche | Kristof Vandermeeren

×