Tobi Waves

taught by Alex Russell

What is AJAX?

An acronym for Asynchronous JavaScripts AND XML

Ever wondered how Google does their cool new apps like (maps.google.co ...) or how something like (shared.snapgrid.com ...) works? There is no real standard yet but a keyword: AJAX. Wikipedia has an evolving page about it: (en.wikipedia.org ...)

The key to AJAX applications is that everything happens on the same page. No page reloading is required.

The browser turns from a dumb page renderer into a protocol client.

Where to use AJAX

AJAX is for interactive applications, for static documents, the current xhtml pages are perfect: Accessible, fast, ... only use AJAX when you can make the users lives better and not worse.

One of the big challenges is cross-browser compatibility. While MSDN and Mozilla provide good references for their browsers, they obviously do not talk all that much about compatibility problems. There is a good resource for such information on (www.quirksmode.org ...)

Getting XMLHttpRequest working

In order to be able to make http requests from within a JavaScript you need a XMLHttpRequest object. While it is readily available in modern browsers, it is not so trivial in IE. The most popular way of doing this today is to use conditional compilation in IE.

/@cc_on @/
/@if (@_jscript_version gt= 5)
... code ...
@end @/

Here is a tutorial (www.webpasties.com ...)

More Code Snippets on (www.fiftyfoureleven.com ...)

innerHTML vs DOM

The fastest and most simple way for altering webpages on the fly is to use the innerHTML propperty of a node. The problem is, that setting innerHTML will replace the node completely and with it all it's properties. So a new node will have to have its properties re-attached, even if it has the same ID as the old node.

If you use DOM for manipulating content, your code on the browser side will have to do more, since that data from the server arrives in XML and not pre-generated HTML as you would with innerHTML. The advantage is that you can do much more fine grain manipulations of the content.

DOM vs innerHTML benchmark (www.quirksmode.org ...)

Send JavaScript from the server?

The fastest way of communicating with the server is to send data encoded as JavaScript from the server and using eval() on the client. The advantage of this is that we do not have to parse the data actively on the client side, but we can use the browsers JavaScript parser to interpret the data. The client side can then access the data structures in JavaScript directly to generate the relevant HTML/XML code. This is especially efficient if you are dealing with large tabular data structures.

There is a standardized subset of JavaScript called JSON (JavaScript Object Notation) for this lightweight data exchange method. More about this on (www.crockford.com ...)

REST API

Communication between an Ajax-style UI and your Server should happen via the REST (Representational State Transfer) API of your Web application. (en.wikipedia.org ...) and (www.xfront.com ...)

Debugging JavaScript

The most simple way is to open the JavaScript console of your browser to see any errors the JavaScript engine generates. For automated testing you may want to use a JavaScript implementation that can be started from the command line like Mozillas Rhino (www.mozilla.org ...) project. There are also several Mozilla extensions that help:

LiveHTTPHeaders (livehttpheaders.mozdev.org ...) shows the HTTP headers exchanges between Mozilla and the server.

Venkman a graphical JS debugger (www.hacksrus.com ...)

Ethereal is also helpful as you can see what really happens on the wire. If you do not have the necessary permissions to sniff data off the wire, you may want to redirect your browser through a proxy where you can dump the data that traverses it.

Links

Examples (dojotoolkit.org ...)

Simple AJAX Toolkit (www.modernmethod.com ...)

About using Ajax on Rails the Ruby web toolkit (www.onlamp.com ...)

Ruby on Rails (www.rubyonrails.org ...)

An evolving browser UI toolkit with pluggable widgets that separate HTML from JavaScript Code (dojotoolkit.org ...)

CPAN for Java Script (www.openjsan.org ...)

Wiki with AJAX Framework overview (www.ajaxpatterns.org ...)

Nice widget and screen effects library for ajax applications (openrico.org ...)

taught by Evan Lenz

XSLT is a language for processing XML documents. XSLT itself is written in XML. The output generated by an XSLT 'program' can be anything, but normally it is used for generating (X)HTML documents which can then be displayed by a browser.

XSLT uses the XPATH language for addressing 'nodes' in an XML document.

XPATH Expressions

An XPath expression is made up from several steps separated by /.

step/step/step

A step consists of three elements: The axis to identify a set of nodes relative to the current-context node. The node test to filter out relevant nodes from the set of nodes selected by the axis and finally any number of optional predicates to further filter which nodes get selected.

axis::node-test[predicate][predicate]

XPath expressions can return 4 types of data:

node-set which is a number of zero or more nodes without duplicates

number a floating point number

string a unicode string

boolean true or false

XPath knows seven different types of nodes:

Root - the toplevel node of a document is called "/"

Element - 'tags'

PI - Processing instructions lt?xml ...?gt

Comment - Comment tags

Text - Character data, including white space!

Attribute - lttag attrib="xxx"gt

Namespace - lt?xml-stylesheet ...?gt

When selecting XPath nodes, you can use different 14(!) axis. By default, you use the child:: axis. Default means, that you don't even have to mention it. So an expression like section is actually child::section. The other common axis is attribute:: it also has an abbreviation, called @ so instead of writing attribute::section you can write @section

The other 12 axis are: descendant-or-self:: which can be abbreviated as // and parent:: aka .. and self:: aka . the remaining axis do not have abbreviations: ancestor:: following-sibling:: preceding-sibling:: following:: preceding:: namespace:: descendant:: ancestor-or-self::

XPath example

XPATH looks at an XML document as if it was a filesystem. Like when navigating a filesystem, there is a context node where from where XPATH looks at the document.

ltarticlegt
ltheadinggtHellolt/headindgt
ltparagtParagraph ltemphgt1lt/emphgtlt/paragt
ltparagtParagraph 2lt/paragt
lt/articlegt

If the first para node is the current context node the expressions would return the following:

* - emph
emph - emph
.. - para
../* - heading,para,para
../para[2] - the second paragraph
/article/* - heading,para,para

The XSLT Processing Model

The most important command in xslt is xsl:apply-templates. A lot of people do not use this function properly since they write only one big template, instead of writing many small ones for different purposes.

If you use multiple templates, xslt will invoke a conflict resolution protocol when several templates match for a particular element.

Selection happens by priority:

-0.5  match=""
-0.25 match="xyz:" 
 0    match="name"
  .5  match="nameA/nameB" 

You can override the priority of a template by setting the priority attribute explicitly.

Whenever XSLT processing is stared, the processor executes the template-rule for /. If you do not supply a template-rule the processor will use its built-in template rules (there is one for each of the seven node types).

Tim O'Reilly

While many building blocks of software are now freely available (OS, database, web servers, browsers, ...) there is a growing number web based applications that take a more and more important role in everyday life that are not open at all. What about google-maps, what if google changes it APIs and you built a business on google maps?

The next wave of big applications will be web integration apps that pull data from existing websites and integrate, filter, consolidate it in new and interesting ways.

Kim Poleses of SpikeSource

She talks about the trend from "Do it yourself" to "Do it together" in OpenSource. We are moving from an EGO system to an ECO system with OpenSource makeing DIY-IT possible. Today, traditional companies start putting OpenSource tools into their business critical applications. IT organizations start putting packages together from a large number of OSS components. The challenge is that these components are all on different release schedules. The bigger the packages get, the more resources have to be invested into keeping these packages tested and up-to-date as new features are added. These custom software packages/stacks have become a competitive advantage for these companies, so they are going to stay. The problem the companies are facing is, that they have to become their own software company with its own testing, release system and everything a normal software vendor does. This costs a lot of money and thus opens new business opportunities for a new kind of service companies. They supply services where companies can offload part of their work in creating and maintaining their own software stack.

SpikeSource is specializing in OpenSource testing. They offer software testing services to companies, but also free testing resources to OpenSource developers.

Andrew Morton, Kernel Integrator with OSDL

How will Linux succeed on the Desktop? It will happen in the same way it worked with other OSS things, they are creeping from the bottom up along the food chain. Do not expect Linux taking the Windows Powerusers desktops by storm. These are the most difficult people to cater for, but they are not the majority, even though they can be very vocal. Linux is in use on many special purpose desktops today: Point-of-sales, trading floor, data entry. As companies see Linux working well in these specialized applications the interest in using Linux on more general purpose desktop applications will grow.

by Damian Conway and Larry Wall

We are almost there, yet! Despite the naysayers. We are close to finishing the design of the language that was never going to be finished. We are close to finishing the implementation of the language that was never going to be implemented.

What is new in Perl 6

Strict and use warnings are always on

No strict refs necessary since the language use a different syntax

No strict subs since Perl6 has no barewords

No raw assignments in conditionals. Since there is a new operator for that.

if ($a = max()){...} becomes if (max() -gt $a) { ...}

String interpolation is much simpler. No more problems with user@address.ch still there are many more sensible interpolation possible with the new syntax. The most simple approach is to add braces in a string their contents will be executed as perl code.

say "The current time is {localtime}";

Every scalar has a method to sprintf it ...

$score.as('%6.2f')
%hash.as('%-10s %2f',"\n");

Single quotes can be modified with 'adverbs' to interpolate some things.

The heredoc syntax has been modified to

print q:to/END/
  blablbalb
  END

Note that the indation of the END marker specifies the left margin of the heredoc.

Indexkeys do not auto quote

 %hash{larry}

would call the larry function. Now use

 %hashltlarrygt 

for autoquoted keys. This creates a problem with filehandles. Use this instead

 while $fh.shift() {...}

or rather with the unarry iterator operator

 while =$fh {...} 

this operation is lazy, so you can use

 for =$fh {...}

and

 while (ltgt) {...} becomes  while =$ARGS {...} 

or rather

 while =ltgt {...} 

aka the fish operator. Filehandles automatically chomp any input.

In Perl6 every object has a perl() method that produces a perl representation of the data structure.

say $file.perl()

no more Data::Dumper.

There is a new reduction operator

$dot_prod = [+] @vec1 gtgt*ltlt @vec2

Perl6 has much better introspection capabilities via question referents

$?SUBNAME $?LABEL @?LABEL

The tell about almost any aspect of perls run-time as well as compile-time environment.

Play with Perl6 today, try pugs.

by Brian Ingerson

Online (www.kwiki.org ...)

Pugs is just another CPAN module but it is a fully working Perl 6 interpreter. Pugs is implemented in Haskell which is a purely functional language.

Currently there are about 100 people with commit access to pugs and it is growing at a startling rate.

If you want to help with perl6 you do not need to know haskell, since a lot of code these days is written in perl6 already.

by Mike Shaver

Extensions for Firefox do everything from Add-Blocking to on the fly Website alteration with GreaseMonkey.

Extensions are composed of 4 elements. A manifest, Chrome (user interface components), Components (non-ui), Default settings.

If Extensions are popular and non intrusive to people who do not use them, they may get integrated into the default firefox.

User interface components are written in XUL, the same xml language Firefox uses for its own UI. XUL can insert new elements into the browser UI, it can add and alter attributes of existing UI elements and it even remove elements completely.

The best way to learn about writing extensions is to take a simple existing extension apart and modify it. Extensions are stored in .xpi files, these are just simple zip files with their file name extension changed. Unzip the file and off you go.

Extension writing in Firefox 1.5 was much simplified, so if you are starting out now, you may want to use the current firefox 1.5 snapshots (deer park) for development.

When you have created a usefull extension upload it to (addons.mozilla.org ...)

Analytical tools for extension writers: DOM Inspector, Venkman the JavaScript debugger.

Links

(xulplanet.com ...)

Books are ok as well, but things evolve, so while the base concepts are all the same you may have to adapt paths and node names to work with current versions of FireFox.

by David Heinemeier Hansen

Rails is a Ruby based Webapp framework that came out of the development of Basecamp. Basecamp is a commercial Web based project management software written by (www.37signals.com ...)

Davids idea when designing rails was to pull out the good ideas from other languages and platforms into a context adapted to small resources available to David at 37signals (0.25 programmers and 1 designer).

Instead of designing the framework before writing Basecamp, David decided to write Rails by creating a method of extracting the framework from Basecamp. So instead of making assumptions about what he would need in the future, he writes Rails in parallel with Basecamp. He calls this application driven development.

How to be successful with an OpenSource project:

Be visible. If no one cares for your OOS project you could as well not "opensource" it, since the cost for publishing will never be recovered.

Release only once the culture of the project is fairly set, so that new influences through new users will not bend the project out of shape. Make sure you can handle the contributions and bug reports from your users.

Increase your visibility by taking on the 'leader-of-the-pack' be careful about aggressiveness though, since if you are aggressive towards others, you will also attract aggressive people to your project.