control-htmlIn the video below, I am showing one of the main USPs from Phosphorus.five, which is its ability to allow you to exercise 100% perfect control over your HTML.

Most of today’s Ajax libraries, will render tons of “magic HTML tags” for you, when you consume them. This eliminates your ability to control what’s being rendered, provides less flexibility for your end result, and often forces you to conform to one specific way of thinking. In addition, it forces you to learn many obscure and difficult to understand methods and APIs. On top of that, many existing Ajax libraries will transmit tons of data over the network when being used.

Phosphorus.five is completely different in those regards, since it allows you to exercise 100% perfect control over what HTML is being rendered. In Phosphorus, unless you ask for it, you won’t get it. Really! In addition, only the changes are being sent from the server back to the client. This saves a lot of bandwidth for you, and allows you to reclaim control over your HTML, while at the same time giving you the convenience, of a 100% “managed Ajax library”, kind of like the way GWT works.

With Phosphorus, you can inject any type of HTML element you wish, at any position in your DOM you wish, having any attributes and properties you wish. All this happening from the comfortable zone of your server-side pf.lambda and Hyperlisp code.

The code from the video above, is included here for reference purposes;

/*
 * Example of how to dynamically inject HTML elements
 * into your page, from Ajax Requests
 */
pf.web.widgets.create:header
  widget:literal
  class:span-24 prepend-top info
  innerValue:Click me!
  element:h1
  onclick
    pf.web.widgets.property.set:header
      innerValue:Hello World
      class:span-24 prepend-top success
    pf.web.widgets.create:foo
      class:span-20 prepend-2 error
      widgets
        literal
          class:span-20 last
          innerValue:This widget was dynamically created
          onclick
            pf.web.widgets.property.set:@/../*/_event?value
              innerValue:I was clicked!
            pf.web.widgets.create
              // change the next property to "after"
              // and see the difference
              before:@/../*/_event?value
              parent:foo
              widget:literal
              innerValue:I was appended BEFORE the existing widget
              class:success span-10 prepend-5

If you don’t believe the above statements, you can create a new “pf.lambda page”, using System42, and paste in the above code, to check out my claims for yourself …