地理信息系统(GIS)是由多种学科和多种技术共同形成的交叉学科，各学科和技术的综合发展使该学科有了长足的发展。由于地球科学、计算机技术以及网络信息技术的迅速发展，Web服务的出现为地理信息的共享和互操作提供了技术上的支持，GIS系统功能互操作及其相关数据共享的需求迫切要求GIS网络化。WebGIS是网络GIS中最为突出的一种，一出现就成为了GIS发展的一颗新星。论文依托于“吉林省村镇规划与建设信息平台”这一项目，项目立项于目前我国的村镇规划与建设的信息化程度还不高，同时信息源分散，来源众多，各种信息的集成度还较低，没有很好的挖掘这些的信息的价值。在信息采集上，各村镇在地理上分散的特性也给信息的采集和呈现的信息化提出了更高的要求。项目构建了吉林省村镇规划与建设信息平台，在系统中，应用功能和GIS系统紧密关联，提供丰富的地理信息相关的业务功能。近年来网站客户端开发规模越来越大并且有很多由AJAX开发的复杂页面，系统中的客户端脚本大量增加，前端开发就产生了诸如代码量大、组织困难、难以维护、代码复用低、扩展适应性差等此类的问题。究其原因，以往前端开发不重视设计模式的应用，仅仅实现基本的交互功能。因此前端架构设计和模块化开发在在前端开发中应运而生。前端模块化开发即把前端依照布局和功能划分为多个开发模块，其中每一个模块实现特定的功能，之后把各个模块合理的组成一个具有完整功能的系统。前端模块化开发能够极大地降低了程序员开发时的相互干扰，协同开发更加快速，此外还能提高网页浏览速度、网络信息组织与维护更高效、精简代码。论文在对HTML5、Openlayers、RequireJS和Backbone技术进行分析的基础上，结合各自的优点，使用Openlayers构建了基于JavaScript的轻量级、开放式WebGIS系统模型，阐述了其设计思想，初步完成了系统实现。把前端优化技术应用到项目实现中，具体分析了各自的性能优化效果。