couchdb-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From Apache Wiki <wikidi...@apache.org>
Subject [Couchdb Wiki] Update of "Generating HTML from Javascript shows and lists" by RogerBinns
Date Sat, 05 Dec 2009 08:07:20 GMT
Dear Wiki user,

You have subscribed to a wiki page or wiki category on "Couchdb Wiki" for change notification.

The "Generating HTML from Javascript shows and lists" page has been changed by RogerBinns.
The comment on this change is: Mention html generation functions in best practises, move html
escaping there.  Add Google's Closure Templating..
http://wiki.apache.org/couchdb/Generating%20HTML%20from%20Javascript%20shows%20and%20lists?action=diff&rev1=3&rev2=4

--------------------------------------------------

  
  == Best Practise ==
  Generate clear concise simple HTML from your show/list functions.  The resulting HTML interface
should be usable from constrained devices (eg cell phones, set top boxes) as well as being
accessible (eg screen readers) and easy to index for search engines.  This is also easier
to automatically test.  You can then run Javascript in the browser (if the browser supports
Javascript and it is turned on) to enhance what is being displayed (eg add extra information,
tooltips, icons, previews of next/previous content, enhanced menus and interaction etc).
+ 
+ It is a '''very''' good idea to use a library that automatically escapes values (eg replacing
< with ampersand lt semicolon) otherwise your application will be prone to [[http://en.wikipedia.org/wiki/Cross-site_scripting|cross
site scripting attacks]].  It should also provide a way of disabling the escaping when you
are intentionally providing raw HTML.
+ 
+ It is convenient if the library has functions for emitting html.  For example it may have
a function to insert an image where you provide the URL and the function generates all the
wrapping HTML, including width/height/caption attributes if you provided them.
  
  == Constraints ==
  The Javascript view server and the environment the code run in mean that some existing Javascript
templating libraries will not work.
@@ -14, +18 @@

   * Some work on complete documents whereas your show and especially list functions are often
working on multiple strings and template fragments
   * Some only do HTML - this is good if they ensure the result is correct HTML
   * Some do any form of templating (eg plain text) which means your resulting HTML can be
invalid
-  * It is a very good idea to use a library that automatically escapes values (eg replacing
< with ampersand lt semicolon) otherwise your application will be prone to [[http://en.wikipedia.org/wiki/Cross-site_scripting|cross
site scripting attacks]].  It should also provide a way of disabling the escaping when you
are intentionally providing raw HTML.
   * Size can be a problem.  Some templating libraries are rather large and depend on other
libraries. They can create many layers of intermediary functions and caching making it hard
to debug what is happening.
  
  == Solutions ==
@@ -34, +37 @@

      Foo is not true-ish
  <% } %>
  }}}
+ 
+ Note that this library has no support, bug tracker or development/test/release process.
+ 
  === mustache.js ===
  [[http://github.com/janl/mustache.js|mustache.js]] is a Javascript version of a Ruby templating
library.  The name refers to the { and } characters looking like a mustache.  Download http://github.com/janl/mustache.js/raw/master/mustache.js
to get the latest version which drops right in using !json/!code as is.
  
@@ -42, +48 @@

  === underscore ===
  [[http://documentcloud.github.com/underscore/|Underscore]] is a small library of miscellaneous
functions that also includes simple [[http://documentcloud.github.com/underscore/#template|templating]]
substantially similar to John Resig's micro templating above.  The templating is not HTML
specific and there is no automatic HTML escaping.
  
+ === closure ===
+ [[http://code.google.com/closure/templates/|closure templates]] are a Google project used
behind the scenes in places like gmail and Google docs.  It is different from the other libraries
in that the templates are compiled to Javascript code and you just include that Javascript
code.  This has the advantage that errors in your templates are detected at build time not
run time.  Values are automatically HTML escaped.  In order for soyutils.js to work, you should
include this line before including it:
+ 
+ {{{
+ var navigator={userAgent: ""};
+ }}}
+ 

Mime
View raw message