- 浏览: 448786 次
- 性别:
- 来自: 成都
文章分类
- 全部博客 (377)
- Java (66)
- C++ (0)
- VC++ (0)
- .net (1)
- css (36)
- 数据库 (22)
- html (2)
- extjs (1)
- jpbm (0)
- javascript (31)
- 物资管理 (1)
- java基础 (5)
- C# (0)
- Android (56)
- window service (1)
- 其他 (2)
- Web服务器 (7)
- jbpm (1)
- eclipse (2)
- tomcat (3)
- java字符串与二进制的相互转化 (1)
- Oracle 数据库 (6)
- FreeMarker (8)
- 浏览器 (1)
- php (1)
- photoshop (6)
- spring (4)
- spring mvc (2)
- Acegi (1)
- webStorm 3.0 (4)
- Mongodb (8)
- mysql (9)
- 软件开发:需求分析 (1)
- 把Java程序作为Windows系统服务 (1)
- nodejs (4)
- json (1)
- 缓存 (1)
- J2ee (2)
- Flash报表 (1)
- MyEclipse+Maven+Tomcat (11)
- 生活 (1)
- Ubuntu (1)
- Bootstrap (1)
- jquery easy ui (2)
- 敏捷开发 (1)
- phone gap (1)
- rest (1)
- 移动开发 (22)
- Redis + Jedis + Spring (3)
- anroid (7)
- grunt 教程 (7)
- PhoneGap (2)
- sublime text (7)
- mariadb (1)
- linux (1)
- maven (2)
- jquery (1)
- ActiveMQ (1)
- LVS Nginx (1)
- nginx (6)
- ngnix (1)
- 爱因斯坦 (1)
- 天干地支 (1)
最新评论
-
muqingren:
...
Maven多模块布局实例详解 -
shutear:
解决了我的难题,谢谢分享!
Unable to load configuration. - action - file:/D:/studytool/apache-tomcat-6.0.16 -
702346318:
[img][/img][flash=200,200][/fla ...
CAS单点登录完整教程(上)【转】 -
liuguofeng:
PersonS631887934 写道学习中。。 有个问题想请 ...
js constructor属性 -
S631887934:
学习中。。 有个问题想请教楼主为什么要加上Person.pro ...
js constructor属性
前言:
自从互联网诞生之日起,JavaScript就成为统治web前端开发的通用语言,并在web开发人员群体中得到了广泛使用。JavaScript 被数百万计的网页用来改进设计、验证表单、检测浏览器、创建cookies,以及更多的应用。
一套完整的BS模式系统界面解决方案。包括十余种不同结构的主页、各种常用的导航与布局模板、丰富的组件、特效和完备的CSS样式库等等,并有多种皮肤样式可供选择,适合WEB开发工程师、前端制作工程师和界面设计师使用,适用于各种应用系统的开发。将这些常用的js、css样式等封装成库,达到最大程度的公用,这将能够大幅度地提高系统开发效率,降低开发成本。
一个良好设计的、适合自身产品的JavaScript基础库,能让一线工程师从繁重的基础问题中解放出来,将更多的精力用于优化业务逻辑和产品体验,从而提高研发效率。但这并非意味着所有公司都一味地采用通用开源的JavaScript库,因为业务特点和需求的不同,不同的公司所需要的JavaScript库的内容也不一样。从长期发展来看,针对自己公司业务的特点,设计最适合自己的JavaScript库才能够达到事半功倍的效果。
一、现状与存在的问题
目前公司现有系统前端的js脚本主要存在以下问题:
1、浏览器兼容性问题
系统js效果无法兼容IE6、IE7、IE8、FIREFOX等主流浏览器,出现页面错位、显示不全等问题。
2、js书写不规范。
不少系统页面js效果全部写在页面里面,页面杂乱,对于一些js效果需要单独js文件链接进来。
3、js代码臃肿,客户端加载慢。
客户端js代码实现复杂,代码量大;js代码冗余,无关代码较多。往往一个简单的效果,几行代码就能实现,确需要加入多个js文件。如我们只是写一个简单的图片滚动效果,一般情况下自己写就可以了,如果这时候用一个JQueryUI就显得臃肿了。
4、js效果与现有系统框架冲突问题
现有系统已使用前台框架与现有js代码相冲突,导致页面错误。如现有睿剑平台开发使用的是MooTools的类库,如果加入基于jquery的效果就会发生冲突。
5、js代码与后台代码结合问题,导致js实现效果与UI设计的效果不一致。
不少页面js效果需要按照UI设计进行包装,往往存在UI设计的界面实现不了或者界面走样
二、解决方案
1、所有系统统一各js效果的UI界面和实现方式。
2、js代码尽量精简而且规范,不要有任何多余的代码。
2、对所有常用js效果进行封装,对外只提供调用的方法。
3、增加兼容性,实现与现有的系统零冲突。
4、控件尽量做到高类聚,低耦合,拆分控件功能特性,让所有特性实现可插拔。
5、各js效果要按需装载,保证从中调出的代码量是最小的
三、实现方式
1、使用原生的js,不使用框架。
缺点:书写复杂,代码量大,考虑浏览器兼容性
优点:不依赖框架
2、完全使用网上主流的js类库和组件,如jquery和jqueryUI,Extjs等
优点:快速开发,简化操作,更多关注业务逻辑的实现,不用过分关心浏览器兼容等问题。
缺点:不良依赖,忽略基础特性,受到框架的架构、设计的理念所限制和约束。
3、自主开发全新类库和组件。
优点:能灵活根据公司业务要求适应。
缺点:工作量大,人力及条件达不到要求。
4、使用网上主流的js类库,结合自身业务特点自主开发组件。
优点:快速开发,简化操作,更多关注业务逻辑的实现,屏蔽浏览器兼容问题。
缺点:不良依赖,忽略基础特性,受到类库的架构、设计的理念所限制和约束。
建议:根据具体业务场景,使用主流js类库,结合自身业务特点自主开发组件与使用原生JS相结合。
对于一些简单的页面效果,可以直接写一些原生的js代码实现,对于一些常用效果,可以将其封装成组件库,使用的时候用统一的语法调用,可以达到JS的结构与行为分离,使页面更干净,使用更方便,减少代码量,不易出错,浏览器兼容。
四、现有js库分析
现在业界的几种主流框架和类库,Jquery,mootools,prototype,YUI,Extjs,dojo,包括国内的淘宝的kissy,百度的七巧板等。
近期国外科技网站W3Techs公布了对近100万个网站进行调查分析报告显示:“jQuery是目前最流行的JavaScript库”。W3Techs发现被调查的网站中有61.0%的网站没有使用任何的JavaScript库,而使用jQuery的占到总数的29.2%,而使用MooTools、Prototyp、ASP.NET Ajax、Dojo等其他JavaScript库的总数只占到9.8%。jQurey占到了JavaScript市场份额的74.7%的市场份额。
如果除却环境原因,在各方面需求都非常均衡的情况下选择框架,个人认为可以从易用性,高性能,功能性,多浏览器兼容,跨平台,可扩展性等方面考虑。
考虑简单易用,Jquery的$远远领先了其他框架。
高性能上,根据主流框架选择器性能测试,Jquery在这方面也是出于领先地位。
功能上,包括UI和其他方面。现在各个框架基本都有自己的UI,不过EXT在这方面更强一些。
可扩展性方面:jquery有大量用户开发的插件可供使用
多浏览器兼容和跨平台现在已经成框架的最基本要求了,基本上每种框架都会跨浏览器。
发表评论
-
Array.prototype.slice.call
2014-11-01 15:18 759在研究某个框架源码的时候,看到的。查了下资料,1.两个部分, ... -
深入理解jQuery插件开发
2014-11-01 12:17 499如果你看到这篇文章,我确信你毫无疑问会认为jQuery是一个 ... -
jquery 控制能输入数字和字母
2014-10-18 15:37 714内容",而"禁用输入法,获取剪切板的内 ... -
值得收藏的新jQuery插件
2014-09-25 22:39 6991) slideshow Really Simple S ... -
窗口大小 window.innerWidth 、window.innerHeight、document.documentElement.clientWidth、
2014-07-27 09:52 905/ Firefox、Chrome、Safari、Opera ... -
精选在线课程:前端开发入门、进阶与实战(中文系列)
2014-07-26 22:06 0在线教育的浪潮吸引了越来越多的网站加入,争相推出各种课程吸引 ... -
浏览器缓存机制
2014-07-26 13:19 660浏览器缓存机制,其实主要就是HTTP协议定义的缓存机制(如: ... -
JavaScript中双叹号“!!”作用
2014-07-25 23:20 492经常看到这样的例子: var a;var b=!!a; ... -
js中style,currentStyle和getComputedStyle的区别
2014-07-13 09:51 777<style> body{margin:0 a ... -
JS OffsetParent属性
2014-06-14 11:12 679offsetParent属性返回一个对象的引用,这个对象 ... -
javascript两行代码按指定格式输出日期时间
2014-05-11 14:33 652// <summary>// 格式化显示日期时间/ ... -
Js中sort()方法的用法
2012-10-12 11:25 1101关键字: sort, 排序方 ... -
网页常用特效整理
2012-04-21 17:37 9481.节日倒计时 < ... -
jquery validate自定义验证方法(转)
2012-03-30 10:55 1061// 身份证号码验证 jQuery.validator ... -
document.documentElement和document.body的区别
2012-03-13 12:00 804网页中获取滚动条卷去部分的高度,可以通过 document.b ... -
document.compatMode属性
2012-03-13 11:58 926document.compatMode用来判断当前浏览器采 ... -
关于scrolltop 兼容 IE6/7/8, Safari,FF的方法
2012-03-13 11:57 22051、各浏览器下 scrollTop的差异IE6/7/8 ... -
IE内存泄露监测工具 sIEve介绍
2012-03-08 10:23 1273在IE下监控页面内存资 ... -
网站优化之Ajax优化及相关工具
2012-03-08 09:56 1015web2.0大量的ajax的使用,提高了ui交互的效率,但 ... -
javascript操作Select标记中options集合
2012-03-04 22:36 778先来看看options集合的这几个方法: options.a ...
相关推荐
网站建设方案是规划和实施一个网站项目的关键步骤,它涵盖了从需求分析到项目实施的全过程。以下是一份详尽的网站建设方案书写的流程: 一、项目启动 在开始编写方案前,首先需要明确项目的目标和背景。这包括了解...
然后,为确保基于“1+X”认证的“JavaScript程序设计”课程案例库建设研究工作能够有序完成,促进该课题研究工作的纵深发展,以及增强课题组成员的科研意识,通过会议研讨的形式,初步形成建设方案和实施计划。...
【企业试验、仿真体系与研发云数据中心建设方案】 在当今数字化转型的时代,企业试验、仿真体系与研发云数据中心的建设成为提升效率、降低成本的关键。本方案详细阐述了新一代企业应用数据中心的基础平台,旨在构建...
网上商城建设方案是一个详尽的计划,旨在指导企业或个人如何构建一个功能齐全、安全可靠的电子商务平台。在本文中,我们将深入探讨这个过程的关键要素,包括商城的背景、目标、市场分析、商业运作模式、建设流程、...
### WMS数字化仓储物流(成品库)建设方案关键知识点 #### 一、项目背景与目标 **项目背景:** - **仓储设备设施陈旧:** 当前成品库使用的仓储设备较为落后,无法满足高效、精准的仓储需求。 - **信息化水平低:*...
【葡萄酒网站建设方案】 一、网站建设目标 1. 提升品牌形象:通过专业且具有吸引力的网站设计,展示葡萄酒的独特魅力和品牌故事,提升公司在行业内的知名度和形象。 2. 提供信息平台:为消费者提供全面的葡萄酒...
"ecshop程序js库冲突patch"是针对这种问题的一个修复方案,由个人开发者或社区成员提出,用于解决ECShop中的JavaScript库冲突。 JavaScript库冲突通常发生在多个库同时使用时,因为它们可能都试图全局定义相同的...
研发仿真体系应用数据中心建设方案的知识点涉及数据中心的构建、管理与应用,企业级数据管理平台的发展,以及与仿真体系的结合。以下详细阐述这些知识点: 1. 数据中心建设方案:方案详细描述了如何建设一个集成了...
"电商平台建设方案详细" 本文将从电商平台建设方案的角度,详细介绍电商平台的架构、系统功能、开发框架、系统安全等方面的知识点。 一、项目总述 电商平台建设方案旨在为企业或个人提供网上交易洽谈的平台,帮助...
【宝克集团网站建设方案】 在21世纪的信息时代,企业网站建设已经成为企业发展的必然趋势。随着互联网技术的快速发展,企业网站不仅是企业在虚拟世界的象征,更是实现电子商务、提升品牌形象和增强市场竞争力的关键...
【研发仿真体系应用数据中心建设方案】是一份详细阐述如何构建高效、智能化的企业级数据中心的方案。这份方案由多个部分组成,旨在为企业提供一个全面的数据管理和研发仿真的平台,以提高工作效率,促进数据的价值...
学校网站建设方案旨在构建一个高效、互动且具有教育特色的网络平台,以满足教育信息化的需求。该方案结合了现代互联网技术和教育领域的特点,旨在提升学校的信息化水平,促进教学、管理和服务的数字化进程。 1. ...
这个“生鲜水果电商平台建设方案”着重于技术方案的探讨,旨在通过技术创新来改变传统的生鲜销售模式,为消费者提供更加便捷、安全的购物体验。下面将详细阐述此方案中的核心知识点。 一、平台架构设计 1. 前端设计...
为了适应这种变化,提供一个高效、实用的前端应用开发实训室建设方案至关重要。本文将深入探讨实训室建设的背景、必要性,并详细阐述具体的建设方案,包括平台介绍、课程体系等内容。 一、行业背景 随着互联网行业...
旅游门户网站建设方案旨在提供一个全面的在线平台,以满足用户对旅游信息的需求,包括预订、查询、分享等服务。以下是对这一方案的详细说明: 1. **项目背景**: 在信息化时代,旅游行业借助互联网的力量,实现了...
【智慧核电设计数据中心建设方案】是针对核电设计领域的一个创新性解决方案,旨在利用现代信息技术提升核电设计过程的效率和质量。方案的核心是Hi-Key D3平台,这是一个新一代的数据管理平台,适应了“工业4.0”和...
【研发仿真体系应用数据中心建设方案】的PPT主要围绕企业级数据管理平台的构建和演化,以及在不同领域的应用展开。Hi-Key系列产品的迭代发展,展现了数据管理平台从基础框架到全面功能覆盖的过程。 Hi-Key TDM从1.0...
《工程建设仓库管理系统》是一款专为工程建设单位打造的高效、智能的仓库管理解决方案。这款系统集成了人工智能技术,旨在提升工程项目的物资管理效率,确保信息的准确性和及时性,从而优化库存控制,降低运营成本。...