HOP: A Language for Programming the Web 2.0

HOP: A Language for Programming the Web 2.0

so hi everyone this is manuel serrano from inria in nice and he's here to speak about the hop programming language and what he's built using that okay so thanks Arthur so do we have to speak close to the microphone okay so my name is Manuel Serrano as Arthur said I'm coming from France thousand friends in security police i work at ania where I'm the leader of a new research team called and which isn't happening for diffuse and secure computing and we aimed at developing theories languages and tools for building differs application and this is one of these tools what I'm that I'm going to demonstrate today so it is absolutely abuse to say that from the beginning of computer science computers have been evolving all the time obviously as everybody knows they are becoming faster and faster smaller and smaller and cheaper and cheaper and the important point for us here is that with each new generation of computers you can imagine new kind of application you can envision new application that you want to write clearly with an iphone you don't want to write the same kind of application as with a prayer computer and yet we are just as a beginning of a new area a new revolution in computer science because up to now application were meant to be executed on one computer which was a dedicated user and from now on it's different in the past we used to be implementing applications that were just dedicated for computer that was running on that computer and that was sometimes and really T to any real world and from now on things are different because as I said previously computers are now for instance mobile phone as well as mp3 players which means just object that you have in the common eyes and even more than that new computers are digital camera you can talk to your camera with a Wi-Fi connection maybe's are also in your TV set if your TV set is recent enough maybe your wristwatch is also provided with a computer he is by itself a computer if you have a Rueter Adam it's also a computer so this means that we are just surrounded with computer and yet this is just a big beginning of something already you can control the light of your apartment with a computer you can probably control also the oven and the shutter of your windows up fully one day you will need maybe you will be able to control your vacuum cleaner with a computer and this means that actually so house we live in and the car we drive are just full of computers and now we are surrounded with computers and the idea is to write new application for this environment we are no longer interested in programming individually each of this device but we want to write applications that are bred them all at a time and so from a computer scientist point of view this raise an interesting question of programming languages because more or less application filled demands dedicated dedicated programming languages for instance if you want to write a floating quite intensive application probably you will use a language like Fortran if you want to implement a GUI for a desktop computer such as this one and if you are adventurous enough maybe you will use a language like c++ if you want to control an airplane most likely you will avoid C++ and probably prefer a language like Esther rail and now the question is if you want to write a difference application for this environment and one more time the problem is no longer to address individually each of these device but it's true right application that embrace them all at a time which long well we will you choose and so as a small step in this direction of providing new language we have designed hub that is exactly meant for programming this application so hoping some key word is just a system that lets you write distributed diffuse applications and run on versatile architecture loose architecture poly specified this application may be designed for single user or for military users it's just up to you the kind of field we are interested in our mostly multimedia house automation and sharing and we see that this three application sale will probably merge because in the future are probably there won't be many difference in between the house automation application and the communication and sharing because you want to mix all this together and so from a technical point of view what up he is nowadays it's a programming language and an execution platform so the idea of the implementation er up is if you want to write diffusion epica to this application you have to be provided with an infrastructure for that and exactly for that we have the web which is already there and which is also already which is already sorry the big fetus so the idea of up is clearly to reuse the web not to provide something for the web but we use a web so if you want something like a metaphor app actually uses the web as a virtual machine which means that we will compile up to the web technologies so compelling hop to web technologies means for us that hub will be a hundred person compatible with the web and so instantly we will be able to reuse everything that is designed and developed for the web so we will be able to take benefit of the entire web but that's not only it up being a full-fledged programming language we are also able to implement new protocols web protocols such as HTTP that kinetically with hot but also new protocols for instance if you want to write a multimedia application maybe you might be interested in implementing protocol for controlling an eye-fi system such as MPD if you want to write a house automation implementation maybe you want to write extent protocol or sing like that and since one more time hut is a full-fledged programming language you can implement this protocol in hub so since hot views the web in a slightly unusual way I would like to spend a couple of minutes explaining what are the difference between the traditional web and hop web so on that picture you see the traditional web you have a just a bunch of clients you have a server and on the back end you have a database with her we introduce a fourth player which is a broker that goes in the middle in between the client and the server here when I say clients actually I'm in a web browser so now your client no longer address a remote server but it address broker that in turn will connect to a server when needed clearly the brokers a good place for implementing mash up because since everybody knows your web browser is not a load to up a new connection to remote server you have to be provided with someone else that opens a connection for you and the broker could be hit but it is also it is possible to write measured with up and maybe it's convenient to write measured without it is not what up is meant for up is meant for controlling your electronic environment so this means that heart is able to communicate with your eye file system with your TV set with your mobile phone etc etc it is able to communicate with these devices either because you are running also another broker on the device and the two bloggers are able to communicate or because as I've said before up as implemented of protocols that let it talk with one with individually each of this device for instance MPD for talking with your eyes I system and when you want to write an application with up maybe you are still interested in fetching data from remote server for instance if you want to write a multimedia application maybe at some point you will be interested in getting the pictures of the cover of the cover album you are currently listening so for that you still need to be able to address remote server so how control your environment but still it is able to communicate with remote server at the end till the broker is also a full fledge web server it is able to communicate not only with one client but with a community of client which means an intranet and typically if you want to write an application for instance for controlling the music that you are playing in an apartment maybe you will want that all the members of the family and the people that are in the apartment be able to control the music so you want actually to design dynamic intranet and that the kind of thing hub can do for you so before presenting the language just to application to illustrate the kind of thing where twisted in so the first application is about house automation and since this application requires a lot of devices that I cannot go with me I just show you a small video clips that give you an idea of what this application is here so we have implemented the extent protocol in hub exam is a protocol that uses a power line to address device you have in your apartment typically the lights eating systems or shutter a thing like that up can be used to control the equipment but it can also be used to react to events so we have implemented x 10mm also sorry extend rely on small devices such as the one you see here which are very cheap equipment each device in new roc would cost something like 50 more or less so it's really affordable it's not extremely reliable but still you can do interesting thing with it and so we have implemented dicks 10 in hub and instantly we are now able to control our electric equipment with web interface and that's what we are playing here we are with a web interface switching on and half the lights that is just on the right part of the screen and we are doing the same thing with our mobile phone we are just controlling the equipment and you will see since we are also able to react to event we are for instance able to implement intruder detection and things like that only using web technologies and web browser so that what you see here the movement have been detected and brother react about it so something on the mobile phone so this is one application first application so related to our automation so I will try to stop it ok so now the second application i would like to illustrate it is this time a multimedia application so the idea is here that in a personal apartment mine actually i have somewhere in the apartment a network attached storage which is this evil evil available on the network which contained just my musics and then i can come up and grab any device any electronic device I have at home and control the music for instance I'm able to go to my bedroom grab my mobile phone and say please this album and raise the volume then i go to my kitchen I grab a PDA and I say no longer playing the bedroom but now play the music in the kitchen then I go in the living room and I say raise the volume and change of music and you see on this application the specificity is that the architecture is really dynamic that it you can come up with your device switch it on switch it off at any moment they can appear disappear and and that's it and the architecture and the application work like that so to give you an intuition of what it looks like the application if you are using a device that as a screen large enough you will be presented with an interface like that where you can just select the music you want to play so let's play classical music let's select back for instance and the concert oh so maybe you can hear it I we all just change that I don't know if you can hear it but my computer is now playing music and we can see it over there right I'm just playing music nothing very fancy and nothing very unusual about that now I will simulate the fact that a new device arrives and in that case a mobile phone so a mobile phone as a small stream so it cannot afford a graphical interface with so many details so maybe my mobile phone we use an interface like that and now you see the point is that from my mobile phone I can select a different sound and my hint of faith behind is have dated automatically and I can stop now the music and once again my interface behind is automatically updated so i have a strong synchronization in between all this interface and so in my application my multimedia application every body sees the same thing everybody is aware of the same information at the same time so how is that implemented mainly all device that exports some musical contents are equipped with a web broker that is a hub broker that is if you want to provide a musical tense you have to embed a broker on your device if you want only to control the music you just need to be provided with us let's say a web interface so on this picture here you see this guy as just is just used for controlling the music while this one is providing music and this means that in these settings you can come in my apartment with your mobile phone and if you have some music in your phone and if you are providing if you are running a hot broker on your phone then I will be able to listen to your music on my I file system same thing I will be able to watch your photograph that are on your mobile phone on my TV set for instance that the kind of thing we are able to do if you just want to control one more time you don't need to be provided with a broker but only a web interface so that's it for the application and now some slide about the real thing which is the programming language behind the scene so programming with hub means mostly programming the relationship in between the client and the broker so what does it looks like a hot program third you have to understand the general idea of the execution of our program every up program executing parallel on at least two different engines one engines is here for computing and one engine is here for interfacing which means that we have really an parallel execution we have to heap to stack but only one shared namespace so this means also that we have in between the client and the broker we have your program and you just in your unique source code you annotate the part that are dedicated to the client and you annotate the part that are dedicated to the broker in this picture the red part are for the client and the blue part our Father a broker and of course what up provides is convenient mean for the red part refer to the blue part and also the other way around so because we are able to refer to the other side we are able to write compile compact source code actually so now the real saying them since you still know HTML you already still know or you already know how because switching from HTM to help is just a matter of syntactic transtech translation at first glance you goes from HTML to hub by simply inserting an open parenthesis in front of your HTML opening markup and you get rid of your closing HTML markup and you replace it with a closing parenthesis and that's it you're done you have your first or program of course that's not the entire staff and I'm cheating a little bit when I say that because if you want to do some interface with HTML you have to implement client-side actions and these are implemented in JavaScript so if you are using traditional web technologies each program contest at least two different languages HTML and JavaScript with up we get rid of that because we have up and hop up on the both side the only thing you have to do is before the expressions that are to be executed on the client you introduce marker which is still design that means to this that means that the following expression will be executed on the client and not on the broker so here I am so now what about generating documents if you want generate document with traditional web technologies you will need to use something different another language typically something like PHP so what you will do is inside you HTML document you will embed PHP markup that we will produce a mad put some output that will be string containing HTML well form hopefully HTML that will contain well form a bully JavaScript expression with up to get rid of that because since up is a full-fledged language you can just compute on the broker and you can just create your abstract syntax tree which represent interface you want to build and you will ship that to the client and now the idea is that you build you elaborate your interface on the broker but the valuable use and your broker can be using the client too and here in this example for writing the so to source code are exactly equivalent that uses dynamically produce table of three elements of three rules sorry for the app version what we do is we create here a list of three element and then we iterate with this iterate or map over the element of the list and so this variable i is successively bound to the value 1 2 3 and you see that this i is used here on the broker to construct the interface that is it is a content of the table data which is here and it is also used on the client to display an alert message when we will click on this table data so I is used on the broker and on the client and so you see that the till design delay an expression to the client and the dollar sign goes the other way around it's lets you refer to broker expression from the client side so now one once again since up is a full-fledged programming language you want to use it for realistic program you need to be able to do some abstractions so you want maybe to define your own widgets and so you can define in hub new widget and new markup just by defining new function so you can see here that we define a new markup row which is just a combination of table data in table row that we use here at any regular market so it means that actually HTML it's just a pre-loaded library in hub and every markup is just a function so now some live live demonstration to to give you a stronger intuition of what the language looks like so I run the demo and I explained the source code afterwards the first one is the first demo is really simple quite stupid actually it's just open a new window and went to mouth flies over the words they disappear except the light which the last one which is great so this is stupid but this is a live demonstration and what I can do for instance is I can edit the source code of my demonstration I can replace the world lady by man I can use this new version and I can rerun the demo and now this is a man that disappears so you see the entire system is dynamic and everything is evolving dynamically so r is a simple idea we actually have only three words The Lady Vanishes that are placed in boxes and we implement user action which just makes it to first where disappears and the last one just to be go back and that's it for the first demonstration quite simple the second one is slightly more complex I will run the demo first and explain the source code after world so the demo is just a list of three elements and I click on this button and I just rotate the element of the list so this demo is absolutely useless but you can imagine a more realistic one which is a table with rows that you can sort according to the colon so some demonstration this one is useful the last one is useless so all is that implemented on the broker side we create a list of three element fubar G which is bound to a variable al here this al variable is used is placed in a in a box then we add a button with a message rotate and each time we click on the rotate button we grab this list that were built on the broker and we flip the elements so you see on this example that we have a data structure here that is used once on the broker and three-time on the client and that another specificity of up to let you reuse the data structure on the both hands so the previous example was not involving any communication in between the client and the broker once the program has been installed on the client of course for some realistic application you need to be provided with a mean for communicating with a broker and for that we have special functions special broker function that we can invoke from the client so when you define a function with this keyword service you can invoke it from the client with this keyword sorry with this keyword wheels up here and so you invoke a service and when the service complete you invoke this callback where RV is bound to the result of the service invocation so how does it work I run the demo once again this demonstration is what is just a web interface for scanning my disk so when I click on this button it tells me that my / TMP currently I have this fight and their size is as follows so r is that implemented we have created one of the service here which except one parameter dear so we first on the gooey side we create an empty box a larger one where we put everything we add a button with a do dash sk message each time will click on this message on this button sorry we invoke the service defined here with the value the actual value / the mps parietal for dia this service actually scan the disk elaborate a list made us five names here and file size send it back to the client the client grabs this list and create the table with stable rule table header and table data and that's it so you see we have exchanged here data structure in the in both direction we have sense left hand p to the broker and the brokers and back list containing strings and integers and we could have decided to move this table construction into the broker side and actually it's up to the programmer to decide where you want to put your program do you prefer to put it on the broker side or do you prefer to put it on the client side it's just up to you the only thing that you cannot move from the broker to the client are these two function here and the reason the reason why you can't move them to the client side it's because this to function actually scans the disk so the note that not even exist on the client so now I would like to explain how we enforce the interface synchronization in the multimedia application and so for that I will just use two three slides so once again I run the demo and explain the source code after a while this demonstration is absolutely abuse I create a new window which contain a canvas and then when i click on the canvas i draw lines on my interface pretty obvious r is it working I have a canvas which is just defined here and then I add an event listener to mouse down even each time the mouse is clicked a line is drawn from the last position of the mouse to the current position pretty obvious pretty regular and a single fancy here now I will slightly extend this example and i will add a new listener to my canvas so i add this new listener I preserve the previous one and I add this new one and what I do here is each time the mouse is clicked in addition to drawing 19 I call a service function which broadcast an event to all the clients that are interested and then on below I create to user interface that we'll just wait for this draw even here so I run the demo and I explict explain the client code just after one so this time my demonstration just spawned three windows and when I click on this one all the web interfaces are updated so you see I have a strong synchronization in between all my web interfaces so how is it implemented I close that so we have one extension to the traditional dumb event model which is this new kind of event here called server event in the previous slide that I've used mousedown event and now i'm using this server event and so this means that all the clients registered to the server event named row and when they receive this event that just draw a line which is provided as the event is provided with a value which describes a mouth position and so that's it that's the way i implement synchronization in between all my interface so now some word about the implementation of up you start with a source code that looks like that and we have three different execution engine involved for executing this program first on the broker side we use by code interpretation for all this blue part then we have a client-side compiler that take all the client-side expression that compares it to JavaScript and then we have native code compiler that is able to compile your library so all the built-in function are compiled to native code so your program executing your program involves running this compiler and using all these different execution mode so what about the bytecode interpreter nothing very much to be said here it is not very fast bike on interpretation but that's not a big problem because your bytecode interpreter is fully compatible with native code competition so you can call native code from bytecode and visa versa so if you need to be filled with us you can pre compile your code and that's it and the way we the reason why we use a bike on interpretation it's just because of the short development time the short development cycle you know you don't need to compile anything to run your program you just load it on the server and that's it you're ready you can run so no computation is a deployment that's the reason why we are still using the bytecode interpreter also it is slow so for the next version what we do is for the architectures that let us embed the compiler we will on the fly compile the program's the first time you load it so this way we will have native code speed even for pause this part of the broken broke execution so now the client-side compiler so this compiler compiles up to JavaScript and it's fully compatible with JavaScript which means that you can call javascript from hub and you can also call up from JavaScript we have decent performance for the client-side computation which means that more or less you pay no overhead because you are using the hub compiler that is a rub compiler deliver source code that has the same performance as unwritten JavaScript code on some micro benchmark here you can even see that hot is faster than JavaScript and this is it for the bag program here and the reason why I hope is that faster than JavaScript it's simply because bag is program written in the hop style with smooth function and it's absolutely mandatory that your compiler is able to inline the small function and clearly JavaScript there from knowing lining so it is strongly penalized by the fact of not in lining this model function but so this benchmark is no text is not is organized not usual and in general so to source code runs at the same speed as you can see for the other programs so now native code compilation more or less the same story that we are slightly so slower than see when we compared to native code except for some benchmark still bag for the very same reason there is still the small functions that you have to win line and GCC clearly is not able to win lines multi function so that way and sip on this program up is faster but in general the performance of a power between the same performance as C and twice the ones I see more or less that kind of performance we have now some some word about the web server so here we try to evaluate the performance of the hub web server and the first test we did was to measure its performance for delivering small static files and here we are just increasing the numbers of requests we address per second to the hot server or to all the web server sorry and we measure their throughput and what you can see here is that for delivering small static file appears mostly as good as all the major web server such as apache light your tomcat now for delivering larger static files up is still pretty decent because it's as you can see here faster than apache and as the same performance as tomcat significantly slower satellit but still pretty decent another interesting part for us is the dynamic aspect that is when you want to deliver dynamic document and what we did here we start true we wrote sorry all very simple program in different languages up PHP Perl and we ran it on several servers and we just measure the throughput of the server and as you can see up is significantly faster than any server for delivering dynamic content and the reason why I hope is faster that's because you are embedding your generator in the server you have no barrier to front to cross when you want to generate a dynamic document sorry so no performance penalty and if you compare the true source code here you will see that more or less help at the same performance for generating dynamic document and generate ecstatic document and this is not the case for the other server so the problem here with tomcat which is pretty slow is a memory problem it's just that tomcat is running out of memory so it is wiped out of memory and so it is no longer able to deliver anything so I think I'm almost done so in conclusion hot peers an ongoing project it is not complete yet it is not polished enough yet we have some dark corner and some black sides but still we are able to implement a whole bunch of application so we are using on a daily basis some applications that are implemented in hub and I won't demonstrate them but for instance one of the sadness application is up slide the applications that I'm running right now for projecting the slide so you can see everything that I have been demonstrated from the beginning is just web pages run on my regular Firefox so you see this is just my slides that I have been presenting to you right now but with the title of the window presented so we have a whole bunch of application everything is available on the web you can just download it why one could be interested in programming with up mainly because there are not so many systems that let you write this application we have implemented hop and we have run up on various devices such as pc mobile phone PDA so it is quite portable and and still reliable you can just download it try it and try your own application it is variable over there it is released under the GPL license you can grab the source code and do whatever you want to do with it and that's it I'm done with this presentation of of up yeah it's me cute yeah yeah okay so the question is what about security and what about protecting your private data right so right now we are they will wreak on security and that's a true problem we have the mechanism provided by the web which means not that much we have authentication provided by the web we are able to implement HTTPS something like that but that's clearly not enough and for us this is just very strong and important research topics and that one of the goal of our research team to study security in languages like up but nowadays we have nothing but we this is something we plan to work on so you're right that's an issue okay so just to repeat the question the architect is the architecture of op such as no clients can communicate directly but they need to to interact as a broker yes that's correct you you have to go to a broker absolutely but we have something like an architecture which is not exactly client-server we are a mix in between client server and peer-to-peer because it's not that clear who is the server and who is the client for instance your mobile phone maybe the server your PDA may be a client and the other way around it will depend on your application okay so first of all to client could be connected to the same broker you don't have to use one broker per client it just up to you but if you happen to have one client / Broker so how does a broker communicate you mean just by using HTTP for instance or because you have implemented something based on upnp for instance that lets to broker discover itself and the communicate like that or because you have implemented your own protocol for instance we have implemented the jabber protocols we're able to communicate using this protocol in between broker it's really up to you but natively may be another way to answer your question you see this wizard form that is dedicated to calling a broker you can use it from a client of former broker so as a broker i can with hub another broker yeah am i dealing with network failure right right now prolly which mean by hands with exception and time out which is just a pain and which is just unreliable so I have no good answer for that and I'm aware also that this is a problem and that we need a new construction in the language for dealing with video I agree with you and I was just speaking about dark side of the language and places where the language is not believe that it is not polished enough and this is one of this side of course yeah so the question is is there a way to make broker more declarative and imperative up the nature of the language is a functional programming language with object-oriented extensions so you use it in paratively or you can build abstraction on top of hub let's just help to you for instance we have we are students that I've been working on reactive extension on top of up so it's not a limitation of hop up is just a language you use it to where you want to use it you build your own abstractions I don't know if it is a very good answer to your question ok no more question yeah so have we looked at legacy code and compatibility between HTML Javascript and hops that is the other way around the first answer is if you are provided with JavaScript code don't convert it to hop into up use it as it is right now because it is fully compatible with up so why bother ring with translating it too hot for HTML well we have not had the idea that it could be useful to translate HTML to help and so we have not looked at that in particular but we are xml parser we have HTML parser so we can just pass your own source code and generate up from it I think it won't be too difficult because we have everything in the language for that so probably we will be even able even able to load in the broker HTML source code and convert it on the fly into abstract syntax tree without anything else no more questions yeah yeah okay so I won't repeat I won't repeat the question because it is a little bit torrent for being repeated I will just try to grab one example which was just this one I guess okay so the question is what about preserving the semantics of scheme which ears that variables are just locations and lexical scoping so you're right hope is rooted deeply and scheme so happiest an extension scheme and we have a call-by-value call-by-value semantics when you stay on the broker or the client but as soon as you cross this boundary we have a copy semantics so here we have this data structure which is built here and when it is sent to the client it is copied to the client so you can have two clients running in parallel and they won't be synchronized because they use our own copy of the function and when you call a function from the broker to the client all there was a rare round we use copy okay no more questions okay so yeah one last yeah yeah yeah so this language is called links until done by Phil well done any student so CID is not exactly the same because first of all links is based on on a mix of XML of ml and xquery so its a mix of two languages more or less the same kind of idea you want to be able to call function from the server and from the client and the other way around and they use a different approach because for instance you are able to use every function on both ends which means that you can call a function that scans the disk from the client and automatically you will execute this code on the broker so say they don't have this notion of functions that are tagged to be executed on the broker and tagged to be executed on the client to compile our manage this for you I don't have in mind exactly which protocols they use when they call the function that traverse the network mundari and I don't remember exactly if the implement sharing or if the implement copy I I should have just reread the paper before coming here but I don't remember so I can't answer you but what I remember is that you don't write your annotation on your program is a compiler that manages that for you and so you don't have the equivalent of this with up construction you just call a function whatever it is and it's on the declaration of the function that you say it is a functional okay this happened to broker but at the cool side you have no annotation so it also means that the grant granularity is different because in length you'd say that this function is a poorer cursor is a broker function and that's it or you says this function is a client function but we cannot as we do here declare just expression that are belonging to one side it's the boundary is just a function declaration not the expression and well set the main differences as far as I remember okay so this is something why I have cheated when I said that you can say that a structure that's true you can set that Astro to be at this moment you cannot send functions so there is no way to do that and I should have mentioned it so that was a good question okay thank you very much

4 thoughts to “HOP: A Language for Programming the Web 2.0”

  1. lol so whats this JAVA all over again???…lol I watched the whole thing and this is what Java was to be the ubiquitus any device web language. Oh spoke to soon.. I read JVM is being used….

    PS. Why didnt the camera man get a better seat !!!!

Leave a Reply

Your email address will not be published. Required fields are marked *