Versions Compared


  • This line was added.
  • This line was removed.
  • Formatting was changed.

Rough Architecture Notes from the Fluid UToronto Team's Whiteboard

These are just notes; they don't make sense yet.

Fluid Component Framework Architectural Notes

Component Framework Architecture

Component APIs

  • What does a component look like?
  • How does it get used?
  • How is it customized?
  • How are new components built?


  • Relationships between components
  • Proxying to the server

Server-side Binding Layer


  • Small number of actions: "verbs"
    **Lots of names: "nouns"


What is a Component?

Components are recurring interactions:

  • Navigation
  • Forms and data
  • Direct manipulation of objects
  • Workflows, wizards, and sequences

On the client-side, a Fluid component consists of:

  • One or more HTML templates
  • One or more layers of CSS
  • JavaScript for behavioural logic
  • Accessibility metadata (control, presentation, etc)
    And on the server-side:
  • A set of conventions for accessing service logic
  • The ability to deliver the appropriate markup, metadata, and user preferences

Image Added

Types of Components

  1. Markup-driven components are general:
    • Server delivers fully-rendered HTML
    • JavaScript manipulates DOM based on id contract
    • Greater flexibility and reuse, but greater server dependency
  2. Data-driven components are smarter but slower:
    • Handle their own template processing
    • Require multiple round-trips to the server for data
    • Allow for less dependency on server-side presentation framework

Elements of the Framework

  • Framework infrastructure: lifecycle supports, server-side communication, etc.
  • Components themselves
  • Transformation engine
  • Server-side binding and delivery
  • Repository of components
  • Metadata standards

Image Added

Transformation Flow

  • Compare metadata and preferences
  • If okay, do nothing
  • Otherwise, request an alternative component
  • Select from alternatives or use initial component

Image Added

Component Repository

  • Mirrored within the application (ie. doesn't require a dependency on a 3rd party server)
  • Options:
    • Repository is just a file system: client-side transformation engine does all the work of finding matches
    • Repository is smart: implemented in Java or JavaScript or anther language, and can respond to requests from a lighter-weight client-side transformation engine