Publications-Theses
Article View/Open
Publication Export
-
Google ScholarTM
NCCU Library
Citation Infomation
Related Publications in TAIR
題名 Web前端網頁的繪製樣式
Patterns for Web Frontend Rendering作者 黃采婕
Huang, Tsai-Chieh貢獻者 廖峻鋒<br>陳宜秀
Liao, Chun-Feng<br>Chen, Yi-Hsiu
黃采婕
Huang, Tsai-Chieh關鍵詞 前端開發
繪製樣式
人機互動
生成式AI
評量規準
DOM操作
繪製
Hydration
Frontend Development
Rendering Pattern
HCI
Generative AI
Rubrics
DOM Manipulation
Rendering
Hydration日期 2025 上傳時間 1-Jul-2025 14:01:41 (UTC+8) 摘要 隨著現代網頁對於快速且流暢的使用體驗需求不斷提升，前端開發技術越來越多樣複雜，然而，現有文獻缺乏一套系統化的前端技術評估指引，導致開發者在選擇適合的解法時面臨困難，需耗費大量時間與心力。本研究旨在透過一套結構化的樣式系統，提供前端技術的系統化指引，以協助開發者更有效率的選用合適的解決方案。研究聚焦於三個核心領域：「操作 DOM」、「繪製」與「Hydration」，共建立 11 份樣式。為了評估這些樣式，作者引入生成式 AI（ChatGPT），搭配多面向的評量規準，這份評量規準根據過去研究中品質好的樣式所具備的屬性所建立，形塑出一套標準化且有效的評估架構。本研究進行兩輪樣式評估實驗，邀請具前端經驗的開發者與 ChatGPT 參與。第一輪中，人類評估者與 ChatGPT 皆依照評量規準，各自對樣式進行評分與回饋。第二輪則將人類回饋提供給 ChatGPT，觀察其在獲得更多語境資訊後回饋內容的變化。結果顯示，ChatGPT 在語境理解與結構推理方面有所進步，但在補充技術細節與準確解讀使用者需求方面，仍明顯落後於人類專家。本論文提出一套可應用於前端開發的實用樣式系統，並探討導入生成式 AI 進行樣式協作評估的可行性與侷限性。研究成果為未來推進前端繪製樣式的實務發展奠定了基礎，並為設計 AI 輔助評估流程提供了參考。
As modern web applications increasingly demand fast and seamless user experiences, frontend technologies have become more diverse and complex. However, the existing literature lacks a systematic guideline for evaluating frontend technologies, making it difficult and time-consuming for developers to select appropriate solutions. This thesis aims to provide a systematic guideline for frontend technologies through a structured system of patterns, helping developers more efficiently select appropriate solutions. Focusing on three core areas, namely, DOM manipulation, rendering, and hydration, this thesis introduces a total of 11 patterns. To evaluate these patterns, the author incorporates generative AI (ChatGPT) alongside multi-dimensional rubrics. These rubrics are based on attributes derived from high-quality patterns in prior research, forming a standardized and effective assessment framework. The author conducted a two-round evaluation process involving experienced frontend developers and generative AI (ChatGPT). In the first round, both human evaluators and ChatGPT independently assessed the patterns using the defined rubrics. In the second round, human feedback was provided to ChatGPT to examine how its responses evolved with additional context. The results indicate that the AI demonstrated improvements in contextual understanding and structural reasoning. However, it continued to lag behind human experts in supplying detailed technical insights and accurately interpreting user needs. This thesis presents a practical system of patterns for frontend development and explores the feasibility and limitations of incorporating generative AI into collaborative pattern assessment. The findings lay the groundwork for advancing rendering pattern practices and inform the design of future AI-assisted evaluation workflows.參考文獻 Alexander, C. (1977). A pattern language: Towns, buildings, construction. Oxford Uni versity Press. Alexander, C. (1979). The timeless way of building. Oxford University Press. Ana, A., Yulia, C., Jubaedah, Y., & Maosul, A. (2020). Assessment of student competence using electronic rubric. Journal of Engineering Science and Technology, 15(4), 2243–2253. Badia, G. (2019). Holistic or analytic rubrics? grading information literacy instruction. College and Undergraduate Libraries, 26(4), 335–349. Bai, A. (2023). Million.js: A fast compiler-augmented virtual dom for the web. The 37th ACM/SIGAPP Symposium on Applied Computing (SAC ’23), Article 4, 8 pages. https://doi.org/10.1145/3555776.3577683 Booch, G. (1994). Object-oriented analysis and design with applications (Second). Ben jamin Cummings. Booch, G. (2006, March). On design. http://www.booch.com/architecture/blog.jsp? archive=2006-03.html Breaux, T. D., Hibshi, H., Rao, A., & Lehker, J. (2012). Towards a framework for pat tern experimentation: Understanding empirical validity in requirements engineer ing patterns. Proceedings of the 2012 International Workshop on Empirical Re quirements Engineering (EmpiRE), 41–47. https://doi.org/10.1109/EmpiRE. 2012.6347679 Buschmann, F., Henney, K., & Schmidt, D. C. (2007). Pattern-oriented software archi tecture: Volume 5. Wiley. Buschmann, F., Meunier, R., Rohnert, H., Sommerlad, P., & Stal, M. (1996). Pattern oriented software architecture- volume 1: A system of patterns. Wiley Publishing. Cai, Z., Liu, Y., Gan, Y., Li, J., & Feng, Y. (2019). Design and implementation of online mall system based on java web. International Journal of Performability Engineer ing, 15(12), 3237–3244. Chen, Z., Yang, L., Wu, J., & Yang, F. (2023). A multi-threaded virtual dom difference method based on web worker. Proceedings of the Sixth International Conference on Computer Information Science and Application Technology, 12800, 1280018. https://doi.org/10.1117/12.3003797 Documentation,N.(2023).Incrementalstaticregeneration[Availableat:https://nextjs.org/docs/basic features/data-fetching/incremental-static-regeneration]. Facebook. (2013). React: A javascript library for building user interfaces. Facebook Open Source. https://reactjs.org/ Gamma, E., Helm, R., Johnson, R., & Vlissides, J. (1995). Design patterns: Elements of reusable object-oriented software. Pearson Education India. Gong, Y., Zhang, W., & Li, M. (2020). The architecture of micro-services and the sep aration of front-end and back-end applied in a campus information system. 2020 IEEE 5th International Conference on Cloud Computing and Big Data Analytics (ICCCBDA), 123–128. https://doi.org/10.1109/ICCCBDA49378.2020.9095621 Gupta, P., & Mehrotra, D. (2022). Objective assessment in java programming language using rubrics. Journal of Information Technology Education: Innovations in Prac tice, 21, 85–97. Harris, R. (2019). Svelte: Cybernetically enhanced web apps. Svelte. https://svelte.dev/ Harrison, N. B. (1999). The language of shepherding. In Pattern languages of program design (pp. 507–530, Vol. 5). Addison-Wesley. Hevery, M. (2010). Angularjs: Superheroic javascript mvw framework. Google Develop ers. https://angularjs.org/ Heyer,R.,Platenius-Mohr, M., vonDetten, M., Gerth, C., & Engels, G. (2019). Onthe(un )adoption of javascript front-end frameworks. Software: Practice and Experience, 49(11), 1689–1706. https://doi.org/10.1002/spe.3044 Iba, T. (2014). Ajourney onthewaytopatternwriting: Designing thepattern writing sheet [Available at: https://hillside.net/plop/2014/papers.html]. Proceedings of the 21st Conference on Pattern Languages of Programs (PLoP 2014). Ireno, D. R. New possibilities for factory design pattern [Cited by: 0]. In: Cited by: 0. 2014, 487–494. https://www.scopus.com/inward/record.uri?eid=2-s2.0 84905717721&partnerID=40&md5=a1bd13817ecd7c6961e680ce25f6f91f Jen, F.-L., Huang, X., Liu, X., & Jiao, J. (2024). Can generative ai really empower teach ers’professionalpractices?comparativestudyonhuman-tailoredandgenai-designed reading comprehension learning materials. Proceedings of the International Con ference on Technology in Education (ICTE 2024), 112–123. https://doi.org/10. 1007/978-981-96-0205-6_8 Keshari, P., Maurya, P., Kumar, P., & Katiyar, A. (2023). Web development using reac tjs. 2023 5th International Conference on Advances in Computing, Communica tion Control and Networking (ICAC3N), 1571–1575. https://doi.org/10.1109/ ICAC3N60023.2023.10541743 Kirichek, G., Skrupsky, S., Tiahunova, M., & Timenko, A. (2020). Implementation of web system optimization method. Proceedings of The Third International Workshop on Computer Modeling and Intelligent Systems (CMIS-2020), 2608, 112–121. http: //ceur-ws.org/Vol-2608/paper16.pdf Kiyokawa, K., & Jin, Q. (2022). A front-end framework selection assistance system with customizable quantification indicators based on analysis of repository and com munity data. Big-Data-Analytics in Astronomy, Science, and Engineering, 41–55. https://doi.org/10.1007/978-3-030-96600-3_4 Kumar, S., Singh, A., & Sharma, P. (2023). Analyzing the difference between reactjs and angularjs. 2023 International Conference on Computing, Communication, and In telligent Systems (ICCCIS), 1–5. https://doi.org/10.1109/ICCCIS57949.2023. 10141276 Lazuardy, M. F. S., & Anggraini, D. (2022). Modern front end web architectures with re act.js and next.js. Research Journal of Advanced Engineering Science, 7(1), 132 141. Li, J., Jangamreddy, N. K., Hisamoto, R., Bhansali, R., Dyda, A., Zaphir, L., & Glencross, M.(2024). Ai-assisted marking: Functionality and limitations of chatgpt in written assessment evaluation. Australasian Journal of Educational Technology, 40(4), 56–72. https://doi.org/10.14742/ajet.9463 Martens, K. S. R. (2018). Rubrics in program evaluation. Evaluation Journal of Australa sia, 18(2), 74–85. McKenzie, S., &Wood-Bradley,G.(2014). Usingrubrics in it: Experiences of assessment and feedback at deakin university. Proceedings of IEEE International Conference on Teaching, Assessment and Learning for Engineering: Learning for the Future Now (TALE), 209–214. Mohammed, A. B., & Naim, A. (2023). A rubric-based assessment plan for continuous improvement in accreditation and quality-educational systems. IGI Global. Ollila, R., Mäkitalo, N., & Mikkonen, T. (2022). Modern web frameworks: A comparison of rendering performance. Journal of Web Engineering, 21(3), 789–814. https: //doi.org/10.13052/jwe1540-9589.21311 Orbaiceta, Á. S. (2024). Build a frontend web framework. Manning Publications. Pavlenko, A., Askarbekuly, N., Megha, S., & Mazzara, M. (2020). Micro-frontends: Ap plication of microservices to web front-ends. Journal of Internet Services and In formation Security, 10(2), 49–66. https://doi.org/10.22667/JISIS.2020.05.31.049 Ragupathi, K., & Lee, A. (2020). Beyond fairness and consistency in grading: The role of rubrics in higher education. Diversity and Inclusion in Global Higher Education: Lessons from Across Asia. Rathinam, S. (2023). Analysis and comparison of different frontend frameworks. Appli cations and Techniques in Information Security (ATIS 2022), 243–257. https://doi. org/10.1007/978-981-99-2264-2_19 Richards, M.(2015). Software architecture patterns. O’Reilly Media. https://www.oreilly. com/library/view/software-architecture-patterns/9781491924242/ Seidel, N. (2017). Empirical evaluation methods for pattern languages: Sketches, classi fication, and network analysis. Proceedings of the 22nd European Conference on Pattern Languages of Programs (EuroPLoP). https://doi.org/10.1145/3147704. 3147719 Sevencan, C. (2024). Optimizing web delivery: The impact of rendering methods on user experienceacrossnetworkconditions[Master’sthesis,CaliforniaPolytechnicState University, San Luis Obispo]. Sianandar, J., & Kerthyayana Manuaba, I. B. Performance analysis of hooks functionality in react and vue frameworks [Cited by: 1]. In: Cited by: 1. 2022, 139–143. https: //doi.org/10.1109/ICIMTech55957.2022.9915183 Singh, P., Srivastava, M., Kansal, M., Singh, A. P., Chauhan, A., & Gaur, A. (2023). A comparative analysis of modern frontend frameworks for building large-scale web applications. 2023 International Conference on Disruptive Technologies (ICDT), 531–535. Singpant, P., & Prompoon, N. Constructing patterns verification criteria based on quality attributes: Web security context patterns case study [Cited by: 1]. In: Cited by: 1. 2016. https://doi.org/10.1109/ICIS.2016.7550839 SolidJS Team. (2024). Solidjs- simple and performant reactivity for building user inter faces [Accessed: 2024-01-25]. https://www.solidjs.com/ Sotnik, S., Shakurova, T., & Lyashenko, V. (2023). Development features of web appli cations. International Journal of Academic and Applied Research. Stanley, D., Coman, S., Murdoch, D., & Stanley, K. (2020). Writing exceptional (spe cific, student and criterion-focused) rubrics for nursing studies. Nurse Education in Practice, 47, 102855. Taylor, B., Kisby, F., & Reedy, A. (2024). Rubrics in higher education: An exploration of undergraduate students’understanding and perspectives. Assessment and Evalu ation in Higher Education. Tong, J., Jikson, R. R., & Gunawan, A. A. S. (2023). Comparative performance anal ysis of javascript frontend web frameworks. 2023 3rd International Conference on Electronic and Electrical Engineering and Intelligent System (ICE3IS), 81–86. https://doi.org/10.1109/ICE3IS.2023.10335250 Vepsäläinen, J., Hevery, M., & Vuorimaa, P. (2024). Resumability: A new primitive for developing web applications. IEEE Access, 12, 9038–9046. https://doi.org/10. 1109/ACCESS.2024.1234567 W3C. (2015). Document object model (dom) level 3 specification. https://www.w3.org/ DOM/ W3Techs. (2024, November). Historical yearly trends in the usage statistics of javascript libraries for websites [Available: https://w3techs.com/technologies/history_ overview/javascript_library/all/y]. Wang, L., & Zhang, W. (2021). Research on mobile data model system for optimizing the performance of web front-end. 2021 IEEE 6th International Conference on Big Data Analytics (ICBDA), 456–460. https://doi.org/10.1109/ICBDA51961.2021. 9450651 Wehner, N., Amir, M., Seufert, M., Schatz, R., & Hoßfeld, T. (2022). A vital improve ment? relating google’s core web vitals to actual web qoe. 2022 14th international conference on quality of multimedia experience (QoMEX), 1–6. Xing, Y., Huang, J., & Lai, Y. (2019). Research and analysis of the front-end frameworks and libraries in e-business development. Proceedings of the 2019 11th Interna tional Conference on Computer and Automation Engineering, 62–66. https://doi. org/10.1145/3313991.3314021 You, E. (2014). Vue.js: The progressive javascript framework. Vue.js. https://vuejs.org/ Zhang, Y., Li, X., & Wang, J. (2022). Comparative performance analysis of javascript frontend web frameworks. 2022 IEEE 46th Annual Computers, Software, and Ap plications Conference(COMPSAC),1234–1240.https://doi.org/10.1109/COMPSAC54236. 2022.00123 描述 碩士
國立政治大學
數位內容碩士學位學程
112462013資料來源 http://thesis.lib.nccu.edu.tw/record/#G0112462013 資料類型 thesis dc.contributor.advisor 廖峻鋒<br>陳宜秀 zh_TW dc.contributor.advisor Liao, Chun-Feng<br>Chen, Yi-Hsiu en_US dc.contributor.author (Authors) 黃采婕 zh_TW dc.contributor.author (Authors) Huang, Tsai-Chieh en_US dc.creator (作者) 黃采婕 zh_TW dc.creator (作者) Huang, Tsai-Chieh en_US dc.date (日期) 2025 en_US dc.date.accessioned 1-Jul-2025 14:01:41 (UTC+8) - dc.date.available 1-Jul-2025 14:01:41 (UTC+8) - dc.date.issued (上傳時間) 1-Jul-2025 14:01:41 (UTC+8) - dc.identifier (Other Identifiers) G0112462013 en_US dc.identifier.uri (URI) https://nccur.lib.nccu.edu.tw/handle/140.119/157630 - dc.description (描述) 碩士 zh_TW dc.description (描述) 國立政治大學 zh_TW dc.description (描述) 數位內容碩士學位學程 zh_TW dc.description (描述) 112462013 zh_TW dc.description.abstract (摘要) 隨著現代網頁對於快速且流暢的使用體驗需求不斷提升，前端開發技術越來越多樣複雜，然而，現有文獻缺乏一套系統化的前端技術評估指引，導致開發者在選擇適合的解法時面臨困難，需耗費大量時間與心力。本研究旨在透過一套結構化的樣式系統，提供前端技術的系統化指引，以協助開發者更有效率的選用合適的解決方案。研究聚焦於三個核心領域：「操作 DOM」、「繪製」與「Hydration」，共建立 11 份樣式。為了評估這些樣式，作者引入生成式 AI（ChatGPT），搭配多面向的評量規準，這份評量規準根據過去研究中品質好的樣式所具備的屬性所建立，形塑出一套標準化且有效的評估架構。本研究進行兩輪樣式評估實驗，邀請具前端經驗的開發者與 ChatGPT 參與。第一輪中，人類評估者與 ChatGPT 皆依照評量規準，各自對樣式進行評分與回饋。第二輪則將人類回饋提供給 ChatGPT，觀察其在獲得更多語境資訊後回饋內容的變化。結果顯示，ChatGPT 在語境理解與結構推理方面有所進步，但在補充技術細節與準確解讀使用者需求方面，仍明顯落後於人類專家。本論文提出一套可應用於前端開發的實用樣式系統，並探討導入生成式 AI 進行樣式協作評估的可行性與侷限性。研究成果為未來推進前端繪製樣式的實務發展奠定了基礎，並為設計 AI 輔助評估流程提供了參考。 zh_TW dc.description.abstract (摘要) As modern web applications increasingly demand fast and seamless user experiences, frontend technologies have become more diverse and complex. However, the existing literature lacks a systematic guideline for evaluating frontend technologies, making it difficult and time-consuming for developers to select appropriate solutions. This thesis aims to provide a systematic guideline for frontend technologies through a structured system of patterns, helping developers more efficiently select appropriate solutions. Focusing on three core areas, namely, DOM manipulation, rendering, and hydration, this thesis introduces a total of 11 patterns. To evaluate these patterns, the author incorporates generative AI (ChatGPT) alongside multi-dimensional rubrics. These rubrics are based on attributes derived from high-quality patterns in prior research, forming a standardized and effective assessment framework. The author conducted a two-round evaluation process involving experienced frontend developers and generative AI (ChatGPT). In the first round, both human evaluators and ChatGPT independently assessed the patterns using the defined rubrics. In the second round, human feedback was provided to ChatGPT to examine how its responses evolved with additional context. The results indicate that the AI demonstrated improvements in contextual understanding and structural reasoning. However, it continued to lag behind human experts in supplying detailed technical insights and accurately interpreting user needs. This thesis presents a practical system of patterns for frontend development and explores the feasibility and limitations of incorporating generative AI into collaborative pattern assessment. The findings lay the groundwork for advancing rendering pattern practices and inform the design of future AI-assisted evaluation workflows. en_US dc.description.tableofcontents 謝辭 i 摘要 ii Abstract iii 目錄 iv 圖目錄 vii 表目錄 ix 第一章 緒論 1 1.1 研究背景與動機 1 1.2 研究目的與問題 5 1.3 研究流程 6 第二章 文獻探討 9 2.1 前端技術背景 9 2.1.1 前端框架的演進與現狀 9 2.1.2 DOM 操作與相關技術 11 2.1.3 繪製機制 12 2.2 樣式 15 2.2.1 樣式的起源與發展 15 2.2.2 樣式的結構 17 2.3 結合生成式 AI 與評量規準來評估樣式 19 2.3.1 評估樣式的方法 19 2.3.2 使用評量規準進行評估 21 2.3.3 生成式 AI 在樣式評估中的應用 22 第三章 研究方法 24 3.1 DOM 操作的樣式 25 3.1.1 Native DOM Manipulation 25 3.1.2 Using Virtual DOM 30 3.1.3 Compiler-based DOM Updates 34 3.2 繪製的樣式 40 3.2.1 電子商務網站案例 40 3.2.2 Client-Side Rendering 41 3.2.3 Server-Side Rendering 46 3.2.4 Static Site Generation 52 3.2.5 Incremental Static Regeneration 57 3.3 Hydration 的樣式 63 3.3.1 Basic Hydration 63 3.3.2 Progressive Hydration 67 3.3.3 Partial Hydration 71 3.3.4 Selective Hydration 75 3.4 樣式評估 78 3.4.1 品質好的樣式屬性 79 3.4.2 評估樣式的評量規準 84 第四章 評估與討論 94 4.1 樣式評估結果分析 95 4.1.1 第一輪評估結果比較分析 95 4.1.2 第二輪評估結果比較分析 98 4.1.3 生成式 AI 的回饋表現 101 4.2 修改後的樣式 102 4.2.1 DOM 操作的樣式 102 4.2.2 繪製的樣式 109 4.2.3 Hydration 的樣式 116 第五章 結論 121 參考文獻 123 附錄 131 附錄 A 評量規準問卷 131 附錄 B 評量規準 132 附錄 C 第一輪各樣式評估表 133 附錄 D 第二輪各樣式評估表 146 zh_TW dc.format.extent 6331359 bytes - dc.format.mimetype application/pdf - dc.source.uri (資料來源) http://thesis.lib.nccu.edu.tw/record/#G0112462013 en_US dc.subject (關鍵詞) 前端開發 zh_TW dc.subject (關鍵詞) 繪製樣式 zh_TW dc.subject (關鍵詞) 人機互動 zh_TW dc.subject (關鍵詞) 生成式AI zh_TW dc.subject (關鍵詞) 評量規準 zh_TW dc.subject (關鍵詞) DOM操作 zh_TW dc.subject (關鍵詞) 繪製 zh_TW dc.subject (關鍵詞) Hydration zh_TW dc.subject (關鍵詞) Frontend Development en_US dc.subject (關鍵詞) Rendering Pattern en_US dc.subject (關鍵詞) HCI en_US dc.subject (關鍵詞) Generative AI en_US dc.subject (關鍵詞) Rubrics en_US dc.subject (關鍵詞) DOM Manipulation en_US dc.subject (關鍵詞) Rendering en_US dc.subject (關鍵詞) Hydration en_US dc.title (題名) Web前端網頁的繪製樣式 zh_TW dc.title (題名) Patterns for Web Frontend Rendering en_US dc.type (資料類型) thesis en_US dc.relation.reference (參考文獻) Alexander, C. (1977). A pattern language: Towns, buildings, construction. Oxford Uni versity Press. Alexander, C. (1979). The timeless way of building. Oxford University Press. Ana, A., Yulia, C., Jubaedah, Y., & Maosul, A. (2020). Assessment of student competence using electronic rubric. Journal of Engineering Science and Technology, 15(4), 2243–2253. Badia, G. (2019). Holistic or analytic rubrics? grading information literacy instruction. College and Undergraduate Libraries, 26(4), 335–349. Bai, A. (2023). Million.js: A fast compiler-augmented virtual dom for the web. The 37th ACM/SIGAPP Symposium on Applied Computing (SAC ’23), Article 4, 8 pages. https://doi.org/10.1145/3555776.3577683 Booch, G. (1994). Object-oriented analysis and design with applications (Second). Ben jamin Cummings. Booch, G. (2006, March). On design. http://www.booch.com/architecture/blog.jsp? archive=2006-03.html Breaux, T. D., Hibshi, H., Rao, A., & Lehker, J. (2012). Towards a framework for pat tern experimentation: Understanding empirical validity in requirements engineer ing patterns. Proceedings of the 2012 International Workshop on Empirical Re quirements Engineering (EmpiRE), 41–47. https://doi.org/10.1109/EmpiRE. 2012.6347679 Buschmann, F., Henney, K., & Schmidt, D. C. (2007). Pattern-oriented software archi tecture: Volume 5. Wiley. Buschmann, F., Meunier, R., Rohnert, H., Sommerlad, P., & Stal, M. (1996). Pattern oriented software architecture- volume 1: A system of patterns. Wiley Publishing. Cai, Z., Liu, Y., Gan, Y., Li, J., & Feng, Y. (2019). Design and implementation of online mall system based on java web. International Journal of Performability Engineer ing, 15(12), 3237–3244. Chen, Z., Yang, L., Wu, J., & Yang, F. (2023). A multi-threaded virtual dom difference method based on web worker. Proceedings of the Sixth International Conference on Computer Information Science and Application Technology, 12800, 1280018. https://doi.org/10.1117/12.3003797 Documentation,N.(2023).Incrementalstaticregeneration[Availableat:https://nextjs.org/docs/basic features/data-fetching/incremental-static-regeneration]. Facebook. (2013). React: A javascript library for building user interfaces. Facebook Open Source. https://reactjs.org/ Gamma, E., Helm, R., Johnson, R., & Vlissides, J. (1995). Design patterns: Elements of reusable object-oriented software. Pearson Education India. Gong, Y., Zhang, W., & Li, M. (2020). The architecture of micro-services and the sep aration of front-end and back-end applied in a campus information system. 2020 IEEE 5th International Conference on Cloud Computing and Big Data Analytics (ICCCBDA), 123–128. https://doi.org/10.1109/ICCCBDA49378.2020.9095621 Gupta, P., & Mehrotra, D. (2022). Objective assessment in java programming language using rubrics. Journal of Information Technology Education: Innovations in Prac tice, 21, 85–97. Harris, R. (2019). Svelte: Cybernetically enhanced web apps. Svelte. https://svelte.dev/ Harrison, N. B. (1999). The language of shepherding. In Pattern languages of program design (pp. 507–530, Vol. 5). Addison-Wesley. Hevery, M. (2010). Angularjs: Superheroic javascript mvw framework. Google Develop ers. https://angularjs.org/ Heyer,R.,Platenius-Mohr, M., vonDetten, M., Gerth, C., & Engels, G. (2019). Onthe(un )adoption of javascript front-end frameworks. Software: Practice and Experience, 49(11), 1689–1706. https://doi.org/10.1002/spe.3044 Iba, T. (2014). Ajourney onthewaytopatternwriting: Designing thepattern writing sheet [Available at: https://hillside.net/plop/2014/papers.html]. Proceedings of the 21st Conference on Pattern Languages of Programs (PLoP 2014). Ireno, D. R. New possibilities for factory design pattern [Cited by: 0]. In: Cited by: 0. 2014, 487–494. https://www.scopus.com/inward/record.uri?eid=2-s2.0 84905717721&partnerID=40&md5=a1bd13817ecd7c6961e680ce25f6f91f Jen, F.-L., Huang, X., Liu, X., & Jiao, J. (2024). Can generative ai really empower teach ers’professionalpractices?comparativestudyonhuman-tailoredandgenai-designed reading comprehension learning materials. Proceedings of the International Con ference on Technology in Education (ICTE 2024), 112–123. https://doi.org/10. 1007/978-981-96-0205-6_8 Keshari, P., Maurya, P., Kumar, P., & Katiyar, A. (2023). Web development using reac tjs. 2023 5th International Conference on Advances in Computing, Communica tion Control and Networking (ICAC3N), 1571–1575. https://doi.org/10.1109/ ICAC3N60023.2023.10541743 Kirichek, G., Skrupsky, S., Tiahunova, M., & Timenko, A. (2020). Implementation of web system optimization method. Proceedings of The Third International Workshop on Computer Modeling and Intelligent Systems (CMIS-2020), 2608, 112–121. http: //ceur-ws.org/Vol-2608/paper16.pdf Kiyokawa, K., & Jin, Q. (2022). A front-end framework selection assistance system with customizable quantification indicators based on analysis of repository and com munity data. Big-Data-Analytics in Astronomy, Science, and Engineering, 41–55. https://doi.org/10.1007/978-3-030-96600-3_4 Kumar, S., Singh, A., & Sharma, P. (2023). Analyzing the difference between reactjs and angularjs. 2023 International Conference on Computing, Communication, and In telligent Systems (ICCCIS), 1–5. https://doi.org/10.1109/ICCCIS57949.2023. 10141276 Lazuardy, M. F. S., & Anggraini, D. (2022). Modern front end web architectures with re act.js and next.js. Research Journal of Advanced Engineering Science, 7(1), 132 141. Li, J., Jangamreddy, N. K., Hisamoto, R., Bhansali, R., Dyda, A., Zaphir, L., & Glencross, M.(2024). Ai-assisted marking: Functionality and limitations of chatgpt in written assessment evaluation. Australasian Journal of Educational Technology, 40(4), 56–72. https://doi.org/10.14742/ajet.9463 Martens, K. S. R. (2018). Rubrics in program evaluation. Evaluation Journal of Australa sia, 18(2), 74–85. McKenzie, S., &Wood-Bradley,G.(2014). Usingrubrics in it: Experiences of assessment and feedback at deakin university. Proceedings of IEEE International Conference on Teaching, Assessment and Learning for Engineering: Learning for the Future Now (TALE), 209–214. Mohammed, A. B., & Naim, A. (2023). A rubric-based assessment plan for continuous improvement in accreditation and quality-educational systems. IGI Global. Ollila, R., Mäkitalo, N., & Mikkonen, T. (2022). Modern web frameworks: A comparison of rendering performance. Journal of Web Engineering, 21(3), 789–814. https: //doi.org/10.13052/jwe1540-9589.21311 Orbaiceta, Á. S. (2024). Build a frontend web framework. Manning Publications. Pavlenko, A., Askarbekuly, N., Megha, S., & Mazzara, M. (2020). Micro-frontends: Ap plication of microservices to web front-ends. Journal of Internet Services and In formation Security, 10(2), 49–66. https://doi.org/10.22667/JISIS.2020.05.31.049 Ragupathi, K., & Lee, A. (2020). Beyond fairness and consistency in grading: The role of rubrics in higher education. Diversity and Inclusion in Global Higher Education: Lessons from Across Asia. Rathinam, S. (2023). Analysis and comparison of different frontend frameworks. Appli cations and Techniques in Information Security (ATIS 2022), 243–257. https://doi. org/10.1007/978-981-99-2264-2_19 Richards, M.(2015). Software architecture patterns. O’Reilly Media. https://www.oreilly. com/library/view/software-architecture-patterns/9781491924242/ Seidel, N. (2017). Empirical evaluation methods for pattern languages: Sketches, classi fication, and network analysis. Proceedings of the 22nd European Conference on Pattern Languages of Programs (EuroPLoP). https://doi.org/10.1145/3147704. 3147719 Sevencan, C. (2024). Optimizing web delivery: The impact of rendering methods on user experienceacrossnetworkconditions[Master’sthesis,CaliforniaPolytechnicState University, San Luis Obispo]. Sianandar, J., & Kerthyayana Manuaba, I. B. Performance analysis of hooks functionality in react and vue frameworks [Cited by: 1]. In: Cited by: 1. 2022, 139–143. https: //doi.org/10.1109/ICIMTech55957.2022.9915183 Singh, P., Srivastava, M., Kansal, M., Singh, A. P., Chauhan, A., & Gaur, A. (2023). A comparative analysis of modern frontend frameworks for building large-scale web applications. 2023 International Conference on Disruptive Technologies (ICDT), 531–535. Singpant, P., & Prompoon, N. Constructing patterns verification criteria based on quality attributes: Web security context patterns case study [Cited by: 1]. In: Cited by: 1. 2016. https://doi.org/10.1109/ICIS.2016.7550839 SolidJS Team. (2024). Solidjs- simple and performant reactivity for building user inter faces [Accessed: 2024-01-25]. https://www.solidjs.com/ Sotnik, S., Shakurova, T., & Lyashenko, V. (2023). Development features of web appli cations. International Journal of Academic and Applied Research. Stanley, D., Coman, S., Murdoch, D., & Stanley, K. (2020). Writing exceptional (spe cific, student and criterion-focused) rubrics for nursing studies. Nurse Education in Practice, 47, 102855. Taylor, B., Kisby, F., & Reedy, A. (2024). Rubrics in higher education: An exploration of undergraduate students’understanding and perspectives. Assessment and Evalu ation in Higher Education. Tong, J., Jikson, R. R., & Gunawan, A. A. S. (2023). Comparative performance anal ysis of javascript frontend web frameworks. 2023 3rd International Conference on Electronic and Electrical Engineering and Intelligent System (ICE3IS), 81–86. https://doi.org/10.1109/ICE3IS.2023.10335250 Vepsäläinen, J., Hevery, M., & Vuorimaa, P. (2024). Resumability: A new primitive for developing web applications. IEEE Access, 12, 9038–9046. https://doi.org/10. 1109/ACCESS.2024.1234567 W3C. (2015). Document object model (dom) level 3 specification. https://www.w3.org/ DOM/ W3Techs. (2024, November). Historical yearly trends in the usage statistics of javascript libraries for websites [Available: https://w3techs.com/technologies/history_ overview/javascript_library/all/y]. Wang, L., & Zhang, W. (2021). Research on mobile data model system for optimizing the performance of web front-end. 2021 IEEE 6th International Conference on Big Data Analytics (ICBDA), 456–460. https://doi.org/10.1109/ICBDA51961.2021. 9450651 Wehner, N., Amir, M., Seufert, M., Schatz, R., & Hoßfeld, T. (2022). A vital improve ment? relating google’s core web vitals to actual web qoe. 2022 14th international conference on quality of multimedia experience (QoMEX), 1–6. Xing, Y., Huang, J., & Lai, Y. (2019). Research and analysis of the front-end frameworks and libraries in e-business development. Proceedings of the 2019 11th Interna tional Conference on Computer and Automation Engineering, 62–66. https://doi. org/10.1145/3313991.3314021 You, E. (2014). Vue.js: The progressive javascript framework. Vue.js. https://vuejs.org/ Zhang, Y., Li, X., & Wang, J. (2022). Comparative performance analysis of javascript frontend web frameworks. 2022 IEEE 46th Annual Computers, Software, and Ap plications Conference(COMPSAC),1234–1240.https://doi.org/10.1109/COMPSAC54236. 2022.00123 zh_TW
