基于CiteSpace 的前端开发研究热点与趋势*

张崇明 高屹，2

（1.西藏民族大学；2.西藏光信息处理与可视化技术重点实验室，陕西 咸阳 712082）

前端开发是通过HTML、CSS和JavaScript以及各种衍生技术、框架和解决方案，向用户展示网页和应用程序界面。自2005年以来，互联网进入了Web2.0时代。随着移动互联技术的普及、应用，前端开发显著提升了现代web界面的美观性和功能性，显著改善了用户体验。前端开发的核心技术和主流框架是什么？前端开发的主要应用领域是什么？前端开发的未来研究趋势是什么？

为了回答上述问题，作者借助CiteSpace可视化软件定义了从2005年到2021年的时间段，以被中国知网的期刊所收录的关于前端开发为主题的文献作为分析对象，并将此以图谱化形式呈现，梳理前端开发的研究热点和未来的发展趋势和应用趋势，从而为以后的前端开发的相关研究提供借鉴。

1 数据源和数据处理方法

1.1 数据源

数据源是中国知网数据库，以“前端开发”为主题词进行检索，时间区间为2005年至2021年，得到符合要求的文献628篇，对相应数据进行处理加工后，以二维表形式存储。

1.2 研究方法

本文以CiteSpace可视化方法为基础，对相关处理后的数据进行分析比较，以可视化的图表方式呈现。

CiteSpace是一种各基于JAVA 语言的PR，能够针对搜索后的文献数据按时间、类别、强度等指标进行计量分类，并且利用可视化的图表形成知识图谱，显示搜索数据的发展变化情况，以可视化的方法描述科普知识的构成、规律以及分布状况的方法，被称之为“科学知识图谱”［1］。

2 数据分析

2.1 年度文献量统计分析

按年度统计发文量可以反应在2005—2021年间前端开发研究领域的热度，结果如图1所示［2］。从图中可以看出，2005—2021年全年的发文量整体呈上升趋势。在2012年前发文量较少增长也较为缓慢，而在2012年后，前端开发的年度发文量快速增加，在2020年达到15年以来的顶峰，有159篇，截至2021年9月底，已发表文献114 篇。这充分得说明了前端开发的研究热度也呈现出上升的趋势。

2.2 作者聚类分析

利用CiteSpace软件进行的作者聚类分析中设阈值为2，表示统计出发文数量在二篇以上的作者，得到了作者的聚类图谱(见图2)。在图表中，作者姓名字体大小和作品的发表数量成正比，而作品间的合作关系用节点间的连接表达［3］。从图2中可知，虽然作者间的协作人员较多且均是日发文量约为一篇的作品，但多数作者都为二人组至三人组，且仅有三组合作人员超过五人的小组，有一个协作人员超过六人的研究小组，这也表明在前端技术开发领域中研究团队数量较多且规模也较小。而在该领域，仅刘晓燕、王红军、孟瑶的发文量超过了3篇。

2.3 发文机构分析

在CiteSpace软件中设置节点Types为institution，阈值调为3，得到发文机构不少于3篇的前端开发的机构图谱（见图3）。从图中我们可以得到发文量大于3篇的机构有甘肃林业职业技术学院、东莞职业技术学院、河北旅游职业学院、河南牧业经济学院、四川信息职业技术学院、辽东学院信息工程学院。其中发文量最多的是甘肃林业职业技术学院和东莞职业技术学院，发表的文章总数为4 篇。从发文的机构我们可以看出前端开发的研究不局限于信息学院，这说明研究人员以多学科的方式发展。另外，发文机构均为专科院校，说明了在更重视职业技能培养的专科院校，前端开发是热门专业［4］。另外，在图中我们可以看到机构的名字之间并没有线连接，这说明机构之间没有合作，都是独立研究。可见，在前端开发领域我国跨机构的研究需要进一步增强。

2.4 关键词分析

2.4.1 关键词共现分析。关键词反映了研究的主题问题及热点问题，通过统计某一时间段内具有内在联系的大量文献集中讨论的热点问题，找出其规律和特点［5］。在CiteSpace软件中，设置关键词节点对关键词进行统计分析，得出关键词共现图谱（见图4）。节点和字体的大小表示关键字的频率。中心性的大小被用来测度关键词的重要性。关键词频次高且中心性强，可以作为研究热点词［6］。在此基础上，选取频度热点关键词，分析其频度与中心性（如表1）。其中，高频关键词主要围绕“前端开发”展开，“web”和“教学改革”的中心性高，说明这两个关键词很重要。与“web”相关的关键词为“前端技术”“浏览器”“数据库”，这些关键词之间的连线又多又粗。这说明了这几个关键词关系紧密，也是前端开发领域内研究的热点。与“教学改革”相关的关键词是“课程体系”“课程改革”。这说明了随着互联网和前端开发的发展，许多高校为了应对技术的发展，对教学方式、课程体系都进行了改革，这也说明了前端开发领域研究的重要性。

表1 前端开发领域TOP5的关键词统计

2.4.2 关键词聚类分析。关键词聚类分析可以反映该领域最热门的研究课题。在CiteSpace软件中，设置聚类数量为8，最终得出8个关于前端开发高频关键词的聚类点。各聚类都由密切联系的关键词组成，设聚类临界值为0.5，当聚类S值大于临界值时，说明是合格的聚类，当聚类S值超过0.7时则表示聚类结果是符合预期要求的［7］。图4 所示的8个聚类的聚类S值全部超过0.7，因此，聚类结果具有较高的可靠性。根据聚类结果，可以将研究热点分为二大主题：前端开发的技术与应用、前端开发的教育，参见图5。

前端开发的技术与应用由“前端开发”“开发技术”“CSS”“json”“软件开发”五个聚类所组成。前端开发的关键就是开发技术，包括最基础的CSS，HTML 和JavaScrip以及所衍生的框架、插件等。其中“CSS”是一组用来控制网页外观的规则，合理运用CSS可以使页面更加美观，用户也会有更加良好的用户体验［8］。另外CSS可与DIV 相结合，这不仅可以使页面美观，还会影响页面重构的难度。这一设计标准与传统的table相比，在实现同一动画效果的前提下，CSS+D IV的框架模式可以用更少的代码实现，为网站节省大量的带宽［9］。因此CSS在前端开发有着十分重要的作用。而“json”作为一种轻量级的数据传输方式使前端开发更容易实现前后端的分离。json可以将JavaScript对象中表示的一组数据转换为字符串，并在需要的时候将它还原为各编程语言所支持的数据格式。前端与后端不会相互影响，只有当json格式改变时才会影响前端。

自2014 年，手机等移动端的使用率超过了PC 端后，前端开发在软件开发中也有着举足轻重的作用。Twitter的Mark Otto和Jacob Thornton为了解决PC 端与移动端的页面不兼容而推出了Bootstrap前端框架［10］。运用Bootstrap框架可以通过自动判断设备而对页面进行响应式调整，从而减少重复性的开发工作，使开发的效率大幅提升［11］。这也是目前前端开发所流行的框架之一。

前端开发的教育由“教学改革”“课程体系”“课程改革”三个聚类所组成。在传统的教学模式中存在着一些问题，如：教学内容相对陈旧，不能适应市场的需求；理论的教学课时较多，学生的学习应用的效果欠佳；课程成绩的评定以理论为重，忽视了项目实践的成绩评定等［12］。因此，针对以上的问题，许多学校对于前端开发的教学以及课程进行了改革，具体表现：（1）增加教学和实践的课时，增强课程内容的连贯性。（2）加强校企融合,针对目前企业对于前端开发人才的实际要求安排课程内容，防止学生所学的技术落后于企业要求，且要与实践相结合，要求学生独立完成项目的开发。（3）以工作过程为依据，设计前端课程。如开发一个网站，要求学生对于该任务熟悉其中的每一步过程，从功能需求分析，网站总体设计，页面详细设计，网站开发实现，测试与优化以及最后的网站发布。（4）引入“1+X”教学模式，为学生划定良好的学习路线。（5）完善考核评价系统，如笔试与实践结合的紧密性，老师对学生的平时上课表现的评价，平时的考核与期中期末的成绩［13］。

2.5 研究趋势分析

对文献高频关键词进行时区分布分析，结果如图6主题路径图所示。图6主题路径图直观反映了特定时间范围内关键词之间的共现关系及某一领域的发展脉络与研究趋势。圆圈代表关键词所在文章的最早发表年份，圆圈的大小代表研究的热力程度，关键词间的连线代表某一关键词与其他关键词存在共现关系，连线的趋势代表这一研究方向的发展脉络。2007年，出现频次高的词是前端开发，说明前端开发领域已经得到了学者的重视且有较高的热度。而随着互联网的发展和HTMl5与CSS3的广泛应用、市场的对前端开发人才需求的进一步地加大，促使许多学校对前端领域相关课程以及教学进行改革［14］。前端的未来发展仍将侧重于可视化。

2.6 研究前沿分析

利用CiteSpace突变体检测算法，能够探测出某段时间范围内频次变化率较高的主题词，即为突变词。突变词就是某个关键词在某一年发表的文章中频繁激增，利用CiteSpace软件的突变词检测的功能可以检测出某一领域频次变化率较高的突现词，突发性节点加粗代表着其对应主题在相应时间发文量突然放大，然后判断该领域的研究前沿［15］。通过使用CiteSpace软件，检测到2005—2021年前端开发相关文献的关键词，如图7所示。

根据关键词突现的时间演变过程，可以将2005—2021年关于前端开发的研究过程按照时间划分为三个阶段。

（1）第一个阶段（2005—2008），在这个阶段，以前端开发发展为主，如数据库、浏览器等。其中，数据库的突变值最大，达到了4.27，且从2005年一直持续到2010年。在2008年在Opera 9.5、FireFox 3、IE8 beta1以及随着iPhone的盛行拥有更多用户的Safari的浏览器大战中，浏览器厂商将发展的重点从独立不相容的技术转向了用户体验，安全和个性化方面，这促使了web前端开发的发展［16］。而于2009年6月在美国加州举行的Velocity 2009论坛上集中讨论了web性能与实践，其中，Ajax性能的讲解，网站性能分析的分享，高效编写JavaScript的经验，特别是互联网巨头对于性能分析与调试工具的展示，更使得前端开发成为发展的焦点［17］。

（2）第二阶段（2012—2018），这一阶段主要以前端开发的主要技术和应用为主，包括工作过程，网页设计、CSS3、C 语言、HTML、MVVM和网站制作。前端开发从简单静态的网页制作转变为精美动态，与用户交互性强的网站开发。而这一转变过程的前提是前端开发技术不断地发展。Web前端开发包括三个要素：HTML、CSS和JavaScript［18］。其中就2008年公布的HTML5来说，它较之与上一代来说，HTML5所提供的平台更为完整，且操作更为简单，不必安装多余的插件，并且它完善了交互功能和多线处理等功能，而更为重要的是HTML5还支持跨平台开发，而这些有点正是前端开发发展的关键［19］。另外由三个要素所衍生的一些框架也进一步增强了前端开发的方便快捷性，如基于MVVM模式的V ue框架，构建动态应用的Angular框架等［20］。另外CSS发展到了CSS3，可以对页面的元素进行静态或是动态的修饰，且增添了许多新的动画效果，往往只需要通过CSS3的一行代码就可以取代之前的复杂操作，十分简单易学［21］。而JavaScript作为一种脚本语言，可以跨平台，跨浏览器运行，且已经更新到了ECMA Script6。

（3）第三阶段（2018—2021），这一阶段主要以前端开发的教育和课程改革为主，包括教学设计，教学改革和职业教育。其中“教学改革”的突变值最大，且时间从2019年持续到了2021 年。而这一变化出现的原因是由于在2019年1月24 日，国务院印发了《国家职业教育改革实施方案》，要求在职业院校，应用型本科院校启动“学历证书+若干职业技能等级证书’制度试点工作”，即1+X 制度［22］。而由于市场对前端开发领域人才的需求增加，且具有入门容易、发展潜力大、薪酬高的特点。因此许多职业类院校在前端开发领域加大了对学生的培养，进行了教学模式的改革。

而在职业教育方面，自2019年高职及中职院校开展普及1+X 职业技能等级证书制度以来，这要求学生在毕业的同时，也要获取国家承认的专业证书，以保证高职院校的学生具备一定的专业实力。而Web前端开发也被确定为首批的试点，这也为国家和社会培养了许多专业性强的技能型人才［23］。因此前端开发的教育也是目前及以后受关注的研究主题。

3 结论

综上，本文通过CiteSpace软件对2005—2021 年前端开发领域CNK I的相关文献进行分析，直观的展示了前端开发研究的现状跟发展趋势。目前，对前端开发的研究主要集中在Web前端开发和教学改革方面。网站制作和职业教育将是未来的发展趋势。但由于数据库格式的限制，无法反映文章的共引情况，作者与关键词的交互关系未能得到探究，而且不能同时收录外文文献进行分析，故存在一定的局限。今后的研究中，研究者可以加强跨地域跨单位的合作，更全面深入的进行前端开发的研究。