Web frontend application developers utilize many components in their work that provide functionality required by the application under development. The components are typically written in JavaScript and may have been developed by 3rd parties or inside the company. The quality of the selected components plays a major role in the overall quality of the web frontend application that they are utilized in. Additionally, the component quality affects the desirability of the component in the eyes of the web application developers that might potentially utilize the component in their application. As an implication, the developers of these components want to them to be high-quality and easy to use. Thus, the problems that this thesis is seeking answers to are how to develop easy-to-use high-quality components and how to measure web frontend component quality. This thesis presents the web frontend component quality model as an answer to these problems. The model is based on web frontend development and component characteristics and research on software component quality models. Both are discussed in the literature review part of this thesis.The web frontend component quality model divides the component quality hierarchically to 4 levels that are quality characteristics, quality sub-characteristics, quality attributes and quality measures. Quality characteristics are high-level abstractions of quality such as functionality and usability that are further specified by the sub-characteristics and attributes. The quality measures are concrete instructions on how to measure values for the quality attributes. The web frontend component quality model consists of 6 quality characteristics, 13 quality sub-characteristics, 30 quality attributes and measures for them.The quality model was tested and evaluated by measuring the quality of the report editor component that is developed by Wapice Ltd. The quality evaluation was able to measure values for the quality attributes according to the model. Additionally, numerous suggestions were provided on how to improve the quality of the report editor component implementation and documentation. Among the improvement suggestions were for example, improving the configurability of the component through configurations object and events interface, providing HTML-based documentation and loading type coverage improvement by adding support to CommonJS and AMD module types.
展开▼