基于移动平台人机交互界面的研究与应用外文翻译

基于移动平台人机交互界面的研究与应用外文翻译内容摘要：

e=text/javascript $() .script() .wait(function(){ ()。 })。 /script LABjs 的独特之处在于它能够管 理依赖关系。 一般来说 script标签意味着每个文件下载（或按顺序，或并行，如前所述），然后按顺序执行。 在某些情况下这非常必要，但有时未必。 wait() call after the first script():LABjs 通过 wait()函数允许你指定哪些文件应该等待其他文件。 在前面的例子中， 的代码不保证在 之前运行。 为保证这一点，你必须在第一个 script()函数之后添加一个 wait()调用： script type=text/javascript $().wait() .script() .wait(function(){ ()。 })。 /script 现在， 的代码保证会在 之前执行，虽然两个文件的内容是并行下载的 Higb Performance JavaScript Loading and Execution JavaScript performance in the browser is arguably the most important usability issue facing developers. Theproblem is plex because of the blocking nature of JavaScript, which is to say that nothing else can happen .while JavaScript code is being executed. In fact, most browsers use a single process for both user interface (UI)updates and JavaScript execution, so only one can happen at any given moment in Loading and Execution 第 12 页 共 23 页 time. The longer JavaScripttakes to execute, the longer it takes before the browser is free to respond to user input.. On a basic level, this means that the very presence of a script tag is enough to make the page wait for thescript to be parsed and executed. Whether the actual JavaScript code is inline with the tag or included in anexternal file is irrelevant。 the page download and rendering must stop and wait for the script to plete beforeproceeding. This is a necessary part of the page’ s life cycle because the script may cause changes to the page while executing. The typical example is using () in the middle of a page (as often used by advertisements). For example: html head titleScript Example/title /head body p script type=text/javascript (The date is + (new Date()).toDateString())。 /script /p /body /html When the browser encounters a script tag, as in this HTML page, there is no way of knowing whether the JavaScript will insert content into the p, introduce additional elements, or perhaps even close the tag. Therefore, the browser stops processing the page as it es in, executes the JavaScript code, then continues parsing and rendering the page. The same takes place for JavaScript loaded using the src attribute。 the browser must first download the code from the external file, which takes time, and then parse and execute the code. Page rendering and user interaction are pletely blocked during this time. Script Positioning The HTML 4 specification indicates that a script tag may be placed inside of a head or body tag in an HTML document and may appear any number of times within each. Traditionally, script tags that are used to load external JavaScript files have appeared in the head, along with link tags to load external CSS files and other metainformation about the page. The theory was that it39。 s best to keep as many style and behavior dependencies together, loading them first so that the page will e in looking and behaving correctly. For example: html head titleScript Example/title Example of inefficient script positioning Group Scripts 第 13 页 共 23 页 link rel=stylesheet type=text/css href= /head body pHello world!/p /body /html Though this code seems innocuous, it actually has a severe performance issue: there are three JavaScript files being loaded in the head. Since each script tag bloc ks the page from continuing to render until it has fully downloaded and executed the JavaScript code, the perceived performance of this page will suffer. Keep in mind that browsers don39。 t start rendering anything on the page until the opening body tag is encountered. Putting scripts at the top of the page in this way typically leads to a noticeable delay, often in the form of a blank white page, before the user can even begin reading or otherwise interacting with the page. To get a good understanding of how this occurs, it39。 s useful to look at a waterfall diagram showing when each resource is downloaded. Figure 11 shows when each script and the stylesheet file get downloaded as the page is 11 shows an interesting pattern. The first JavaScript file begins to download and blocks any of the other files from downloading in the meantime. Further, there is a delay between the time at which is pletely downloaded and the time at which begins to download. That space is the time it takes for the code contained in to fully execute. Each file must wait until the previous one has been downloaded and executed before the next download can begin. In the meantime, the user is met with a blank screen as the files are being downloaded one at a time. This is the behavior of most major browsers today. Inter Explorer 8, Firefox , Safari 4, and Chrome 2 all allow parallel downloads of JavaScript files. This is good news because the script tags don’ t necessarily block other script tags from downloading external resources. Unfortunately, JavaScript downloads still block downloading of other resources, such as images. And even though downloading a script doesn’ t block other scripts from downloading, the page must still wait for the JavaScript code to be downloaded and executed before continuing. So while the latest browsers have improved performance by allowing parallel downloads, the problem hasn’ t been pletely solved. Script blocking still remains a problem. Because scripts block downloading of all resource types on the page, it39。 s remended to place all script tags as close to the bottom of the body tag as possible so as not to affect the download of the entire page. This code represents the remended position for script tags in an HTML file. Even though the script downloads will block one another, the rest o。