Client/server Web applications as a single program

Ocsigen makes it possible to write Web applications as a single program:

  • Same language and libraries for client and server parts
  • No need to encode data before sending it
  • Use server-side values in your client code!
  • Call server-side functions from the browser!
  • Handle server-to-client communications transparently!
  • Keep your client-side program running as you navigate through the site

Recent browsers make it possible to run very sophisticated programs. Javascript machines are now fast, and HTML5 greatly reduces the need for browser plugins, even for playing music or watching videos. Most modern Web sites now involve dynamic features running on both the server and client sides, usually implemented separately using two different frameworks and languages.

Ocsigen makes it possible to write both parts using a very expressive and safe programming language: OCaml.

A single program for the whole Web application

Programming both sides of a client/server application using the same language is great (same datatypes, same libraries, no need to learn two languages, etc.) Actually, Ocsigen goes further: now one can write the full application as a single program. A special syntax is used to distinguish code that's to be sent to the client, kept on server side, or shared between client and server.

It is also possible to transparently use server-side variables in code running on the client. Many server-side features are available on client side.

Ocsigen also provides advanced bidirectional communication channels between the client and server. For example a client-side program can be notified when some event has occurred on the server (example: "you have a message").

Here is a skeletal example of an Ocsigen application, showing the syntax used to distinguish between server, client, and shared code.

{client{
  ... (* OCaml code run when the browser loads the first page of the site *)
}}

{shared{
  ... (* OCaml code shared between client and server *)
}}

{server{
  ... (* OCaml code run while launching the server (function definition, etc.) *)

  let a = ... (* definition of a server side value called a *)

  ...
  (* generation of a portion of page: *)
  div
    ~onclick:{{ (* Ocaml code run in the browser when the user clicks on the <div> element *)
                  ... %a ... (* using the server side value a *)
               }}
    [ (* div content *) ]

}}

Persistent client side programs

One of the most advanced features of Ocsigen is its ability to allow a client-side process to persist after clicking on a link or sending a form. That is to say: the client side program does not stop!

This means that:

  • You can keep a state on client side (for example in an OCaml reference)
  • Parts of the page can persist after loading a new page
  • Music and videos do not stop!
  • Ocsigen applications are fully compatible with traditional Web interaction (bookmarks, back buttons, ...)

Example: If you implement a music streaming Web site, you can continue your navigation on the Web site while listening music–while going to other albums, putting bookmarks on them, and adding them to your playlist.

Js_of_ocaml

To use OCaml on the client side, Ocsigen has a compiler from OCaml bytecode to Javascript, called Js_of_ocaml. This makes it possible to run OCaml programs in a browser, and can be used independently from the rest of the framework.

The Javascript code produced by the compiler is fast, concise, and portable. It is very easy to bind Javascript libraries to invoke them from OCaml programs. For example, OClosure is a binding for the Google Closure widget library.

Js_of_ocaml is very easy to install and use. It can be used without Eliom for standalone client-side programs or in combination with Eliom for client/server Eliom applications.