电子商务系统前端性能优化的研究与实现陈韵晴

本科生毕业论文（设计）论文题目：电子商务系统前端性能优化的研究与实现姓名：陈韵晴学号：1209040150班级：1202年级：12专业：电子商务学院：信息与安全工程学院指导教师：喻晓和完成时间：2016-03-07作者声明本毕业论文（设计）是在导师的指导下由本人独立撰写完成的，没有剽窃、抄袭、造假等违反道德、学术规范和其他侵权行为。对本论文（设计）的研究做出重要贡献的个人和集体，均已在文中以明确方式标明。因本毕业论文（设计）引起的法律结果完全由本人承担。毕业论文（设计）成果归中南财经政法大学所有。特此声明。作者专业：电子商务作者学号：1209040150作者签名：电子商务系统前端性能优化的研究与实现TheResearchandImplementationofFront-endPerformanceOptimizationintheE-commerceSystem2016年03月07日摘要计算机技术的飞速发展推动了网上购物的热潮，使得电子商务系统特别是B/S架构网站的开发需求急速增长。电子商务网站不仅要尽可能丰富地展现用户所需的信息内容，更要注重网站的性能优化，提升用户的使用体验，因为购物网站的用户规模和使用到的功能内容往往十分庞大，造成网站性能的下降是十分严重的。因此对电子商务网站进行性能优化十分重要。而对于一个电子商务网站的性能优化，后端的相关优化技术（比如编译器选项、数据库索引、内存管理等）已经比较成熟，但是对于前端性能优化的研究水平仍有待提升。最为重要的一点是，网站的性能黄金法则告诉我们，当浏览器访问一个网站时，总加载时间中只有10%-20%是花在了后台文件比如HTML网页的下载上，而剩下的80%-90%则用在页面前端组件的加载上，可见对于同样程度的优化，前端比后台有更大的性能提升空间，对提升用户体验有着非常重要的影响。论文首先简要介绍了网站前端优化这一领域的研究背景和国内外研究现状，指出前端优化的重要性，再说明论文的大致内容和篇章结构安排，接着分析了可能影响前端性能的一些主要的因素，研究了涉及网站前端性能优化这一问题的相关技术，从而针对那些可改进的因素并结合相关技术和经验提出了相应的解决方案，比如HTTP请求优化、客户端缓存优化、使用压缩技术、页面元素优化、重定向优化、使用Ajax技术、减少DNS查询等等，除了理论性的分析和研究，还适当地制作一些小案例来对这些解决方案进行验证，通过使用一些专业的网页数据采集和分析工具来获得网站优化前后的数据，对这些数据进行对比，观察并分析优化的效果。最后，结合当前的电子商务热点主题和热门技术，设计并实现了一个基于JSP技术和SQLSERVER数据库的电子商务网上超市购物网站，并结合前面提出的前端性能优化方案，在尽量不改变后台的前提下修改这个网站，通过采集整理优化前后的详细数据进行对比分析，来证明这些优化措施对网站性能优化的提升的实际有效性，并进一步验证前面所述的前端性能优化理论和方案是正确、可行的。关键词：电子商务；网站前端；性能优化AbstractTherapiddevelopmentofcomputertechnologyhavepromotedtheonlineshoppingboom,makingtherapidgrowthofdevelopmentneedsofthee-commercesystem,inparticularthesiteinB/Sstructure.E-commercesitesnotonlyasrichaspossibletoshowthecontentsoftheinformationrequiredbytheuser,butalsotopayattentiontoperformanceoptimizationofthewebsite,toenhancetheuserexperience,becauseusersusetoscaleandcontentfeaturesshoppingsitesareoftenverylarge,resultinginsiteperformancethedeclineisveryserious.Therefore,e-commercesiteperformanceoptimizationisveryimportant.Forane-commercesiteperformanceoptimization,optimizationrelatedtothebackend(suchascompileroptions,databaseindexing,memorymanagement,etc.)arealreadyquitemature,butthefront-endperformanceoptimizationresearchlevelremainstobeimproved.Themostimportantpointisthatthesiteperformancegoldenruletellsusthatwhenthebrowservisitsasite,thetotalloadtime,only10%-20%isspentthebackgrounddocumentsuchasdownloadingHTMLpages,whiletheremaining8090percentisspentonthepageisloadedfront-endcomponents,visibleforthesamedegreeofoptimization,thefrontendthanthebackgroundhaveagreaterperformanceheadroom,toenhancetheuserexperiencehasaveryimportantinfluence.Thispaperbrieflyintroducesthebackgroundofthestatusquointhisareaofthewebsitefront-endoptimizationanddomesticandinternationalresearch,pointedouttheimportanceoffront-endoptimization,andthenexplainedthegeneralcontentandchapterstructureofthepaperis,thenweanalyzesomeofthemajorfactorsthatmayaffecttheperformanceofthefrontendResearchinvolvingthewebsitefront-endperformanceoptimizationproblemoftherelatedart,soforthosefactorsthatcanbemodifiedandcombinedwithrelevantskillsandexperienceputforwardthecorrespondingsolutions,suchasHTTPrequestoptimization,clientcacheoptimization,theuseofcompressiontechnology,pageelementoptimization,optimizationredirection,usingAjaxtechnologytoreduceDNSqueries,andso,inadditiontotheoreticalanalysisandresearch,butalsoappropriatetomakesomesmallcasestoverifythesesolutionsbyusingsomeprofessionalwebdatacollectionandanalysiswebsiteOptimizertooltoobtaindatabeforeandaftercomparisonofthesedata,observeandanalyzetheeffectofoptimization.Finally,withthecurrenthottopicsandpopulare-commercetechnology,designandimplementationofaJSP-basedSQLSERVERdatabaseande-commerceshoppingsitesonlinesupermarket,combinedwithfront-endperformanceoptimizationpreviouslyproposed,inasmuchaspossiblewithoutchangingthebackgroundmodifythesite,wereanalyzedbycollectingdetaileddataprocessingbeforeandafteroptimization,tofurtherprovethevalidateandeffectivenessoftheseaforementionedfront-endperformanceoptimizationtheoriesandprograms.Keywords:E-commerce;performanceoptimization;Webfrontend目录1绪论.................................................91.1选题背景及意义.............................................91.2国内外研究现状............................................101.3论文研究内容及结构........................................112网站前端性能优化概述.................................122.1电子商务网站设计模式......................................122.2电子商务网站设计模式前端性能的影响因素分析................122.3前端性能测量方法..........................................143电子商务网站前端优化方案.............................143.1HTTP请求优化.............................................153.1.1原理.....................................................................................................................153.1.2使用图片地图.....................................................................................................153.1.3CSSSprites..........................................................................................................183.1.4脚本和样式表的合并.........................................................................................193.2利用客户端缓存进行优化....................................193.2.1原理...........................................................