【摘要】：在實際的Web開發(fā)中，級聯(lián)樣式表（CSS）的開發(fā)與維護是一件困難的事情，作者通過調(diào)查Web重構(gòu)行業(yè)內(nèi)的63位開發(fā)人員，統(tǒng)計出目前的CSS開發(fā)中存在的問題，包括三類問題：CSS難以重復利用、CSS自動化功能欠缺以及不同瀏覽器解析CSS的不一致。針對這些問題，作者設(shè)計了ExtCSS——CSS語言之上的高級語言，它擴展了原生CSS的語法，目的是提高在開發(fā)與維護CSS代碼的工作中的效率，同時作者實現(xiàn)了ExtCSS語言的處理器，，用于把ExtCSS代碼翻譯成CSS代碼。在最后，我們采用了實證軟件工程方法設(shè)計實驗，證明了采用ExtCSS比原生CSS完成開發(fā)與維護的任務(wù)更為高效。 ExtCSS語言是CSS語言的超集，即是ExtCSS語法是兼容已有的CSS3標準，降低了開發(fā)者學習ExtCSS的成本。其次，ExtCSS設(shè)計了變量、函數(shù)以及嵌套的語法，使得代碼可讀性與可維護性更佳。ExtCSS語法參考了流行的Web程序語言來設(shè)計，其中變量命名規(guī)則參考了Linux里Shell腳本以及PHP腳本的變量命名規(guī)則，而作用域則參考了Javascript語言中的作用域鏈的思想。 在Web產(chǎn)品上線前，往往需要優(yōu)化性能，其中與CSS的相關(guān)的工作主要包括了CSSSprite以及壓縮CSS代碼。為了節(jié)省在這個階段所帶來的效率開銷，ExtCSS處理器還設(shè)計了CSSSprite語法以及解壓/壓縮的自動化功能。 ExtCSS處理器使用Java語言編寫，能在不同的操作系統(tǒng)上運行。它使用了開源的ANTLR生成語法分析器，并且用Junit做單元測試工具。 本文對ExtCSS進行了兩個實驗。在第一個實驗中，我們爬取了hao123導航首頁的全部網(wǎng)站底下的所有CSS文件，通過ExtCSS處理器的成功解析這些CSS文件，從而證明ExtCSS兼容原生CSS語法。在第二個實驗中，我們采用了實證軟件工程方法去設(shè)計實驗，邀請若干從事Web重構(gòu)行業(yè)的學生/工作人員參與實驗，通過完成三項開發(fā)維護CSS代碼的任務(wù)，從實驗結(jié)果中體現(xiàn)了采用ExtCSS比原生CSS完成開發(fā)與維護的任務(wù)更為高效。 最后，ExtCSS還應(yīng)用到了實際Web軟件產(chǎn)品中CSS的開發(fā)過程。
[Abstract]:In the actual Web development, the development and maintenance of cascaded stylesheet (CSS) is a difficult task. By investigating 63 developers in the Web refactoring industry, the author counts out the existing problems in the CSS development. There are three types of problems: CSS is difficult to reuse, CSS automation is lacking, and different browsers do not parse CSS consistently. Aiming at these problems, the author designs a high-level language based on ExtCSS--CSS language, which extends the syntax of native CSS, in order to improve the efficiency in developing and maintaining CSS code. At the same time, the author implements the processor of ExtCSS language. Used to translate ExtCSS code into CSS code. Finally, we use the empirical software engineering method to design experiments, which proves that ExtCSS is more efficient than native CSS in the task of development and maintenance. ExtCSS is a superset of CSS, that is, ExtCSS syntax is compatible with existing CSS3 standards, which reduces the cost for developers to learn ExtCSS. Secondly, ExtCSS designs variables, functions and nested syntax to make the code readable and maintainable. The variable naming rules refer to the variable naming rules of Shell script and PHP script in Linux, and the scope of scope refers to the idea of scope chain in Javascript language. Before the Web product goes online, it is necessary to optimize the performance. The work related to CSS mainly includes CSSSprite and compressed CSS code. In order to save the efficiency cost at this stage, the ExtCSS processor also designs CSSSprite syntax and decompression / compression automation function. ExtCSS processors are written in the Java language and run on different operating systems. It uses open source ANTLR to generate parsers and uses Junit as a unit test tool. In this paper, two experiments on ExtCSS are carried out. In the first experiment, we crawled all the CSS files under all the websites on the front page of hao123 navigation, and parsed these CSS files through the success of the ExtCSS processor, thus proving that ExtCSS is compatible with native CSS syntax. In the second experiment, we used an empirical software engineering approach to design the experiment, inviting several students / staff members in the Web refactoring industry to participate in the experiment and to complete three tasks of developing and maintaining CSS code. The experimental results show that ExtCSS is more efficient than native CSS in the task of development and maintenance. Finally, ExtCSS is applied to the development process of CSS in actual Web software products.
【學位授予單位】：中山大學
【學位級別】：碩士
【學位授予年份】：2013
【分類號】：TP332

【參考文獻】

相關(guān)期刊論文 前1條

1 陳杰;Dreamweaver在動態(tài)網(wǎng)頁設(shè)計中的應(yīng)用[J];礦業(yè)工程;2005年03期

本文編號：2420579