Differences
This shows you the differences between two versions of the page.
Both sides previous revision Previous revision Next revision | Previous revision | ||
examples:example3 [2009/10/26 19:22] aspectscript |
examples:example3 [2009/11/06 20:41] (current) aspectscript |
||
---|---|---|---|
Line 2: | Line 2: | ||
In Facebook, user pages are updated with the last messages from friends without the need to reload the page. To achieve this, Facebook uses Ajax: a set of Web development techniques for asynchronous client-to-server communication. However, when page elements (e.g. the last messages) depend on Ajax responses, they must be updated after every communication with the server to show up-to-date information. The complexity of Ajax updates can be alleviated by introducing basic support for //reactive values//: when a value originating from an Ajax response changes, all page elements depending on it are updated accordingly. Using AspectScript, | In Facebook, user pages are updated with the last messages from friends without the need to reload the page. To achieve this, Facebook uses Ajax: a set of Web development techniques for asynchronous client-to-server communication. However, when page elements (e.g. the last messages) depend on Ajax responses, they must be updated after every communication with the server to show up-to-date information. The complexity of Ajax updates can be alleviated by introducing basic support for //reactive values//: when a value originating from an Ajax response changes, all page elements depending on it are updated accordingly. Using AspectScript, | ||
- | |||
- | The implementation follows: | ||
< | < | ||
<link href="/ | <link href="/ | ||
<script type=" | <script type=" | ||
+ | |||
< | < | ||
<iframe id=" | <iframe id=" | ||
- | <a id=" | + | |
+ | <a id=" | ||
</ | </ | ||
+ | |||
+ | \\ In the previous window, the number of messages is updated every 3 seconds. The following piece of code achieves the required behavior. Using the small library for reactive values, it is possible to create a // | ||
+ | |||
+ | <code java> | ||
+ | var msgs = new ReactiveValue( " | ||
+ | newMessages.innerHTML = msgs; | ||
+ | </ | ||
+ |