[TYPO3-v4] Idea how to speed up Backend with ExtJS

Kay Strobach typo3 at kay-strobach.de
Mon May 2 19:05:49 CEST 2011


Hello Guys,
Hello Xaviar,

as written some time ago i have some ideas to make TYPO3 Backend feeling
faster.

The startingpoint of all this stuff is the user story of an editor.

Current Technologie of TYPO3v4:
=================================
 - Extbase nested Border Layout with some areas
   (north, center, east west, ..)
 - Iframe for modules
 - Viewport for pagetree which hides conditionally
 - Module change with the following JS Code:
   top.goToModule = function(modName, cMR_flag, addGetVars) {
	TYPO3.ModuleMenu.App.showModule(modName, addGetVars);
   }
   e.g. top.goToModuel('tx-sitemgr-mod1');

  Pro of this Approach
  =================================
   - save some kb on load
   - keep dom small
   - relativ fast (safe ram on client)

  Cons of this Approach
  =================================
   - Switching modules is slow
   - you often see the loading indicator
     -> some people hate it already ;)
     -> even if it was technically correct


Better way of Doing it - still being compatible with old approach ;) [1]
=================================
 - Use an CardLayout
 - Let the first card be the current iframe (compatibility)
 - Use the following Hook to include JS to Backend
   $GLOBALS['TYPO3_CONF_VARS']['typo3/backend.php']
           ['additionalBackendItems'][] = <...>
 - The module needs to register to a specific TYPO3-Modulemanager
 - If a page is selected in the pagetree an event is thrown, which is
   bubbled to the current active card
    - if the iframe is active -> reload with new param
    - if a different card is active just fire an event for the module
      (then stores can be reloaded  ...)

  Pro of this Approach
  =================================
   - Switching modules is fast if new approach is used
   - you won't see the loading indicator in new modules, as the module
     is not realy loaded again
   - changing existing modules should be quite easy
     (it's just some extjs)
   - existing functions can determine easily if it's an old or an new
     module -> needs some work
   - tine20.org and other software work with this idea
   - more desktop like feeling
   - rapid reaction
   - new modules just need a JS / settings and a lang file and finally
     some EXTDirect functions

  Cons of this Approach
  =================================
   - need some more kb on load
   - dom is blown up
   - needs more ram at client, can be slow with very old browsers

@Xavier: You find my contact details on my homepage if you want
         contact me personally

Thanks for reading
Regards
Kay


[1] http://dev.sencha.com/deploy/ext-3.3.0/docs/?class=Ext.layout.CardLayout
-- 
http://www.kay-strobach.de - Open Source Rocks


More information about the TYPO3-project-v4 mailing list