`
李俊良
  • 浏览: 146086 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

从tab选项卡发出的一个性能思考和延升

阅读更多

tab选项卡为什么如此流行,很多js框架基本上都有选项卡这个组件,这个东西仅仅是美观和操作方便吗?

 

在我上次接触到一个使用web做类似应用软件的项目之前,我也仅仅觉得这种选项卡比较漂亮,也操作方便

 

但是在那个系统开发的时候,很多人都一直在提,性能,性能,提高性能,但是他们放弃了选项卡,我很郁闷,我简单的说一下我对选项卡的理解

 

当用户点击菜单某一个链接的时候,页面右侧应该出来一个带选项卡的窗口,然后点击另外一个菜单链接的时候,直接将选项卡覆盖在前一个选项卡前面,并显示里面的内容,如果用户要重新看上个链接的窗口就可以不用进行对服务器的请求而直接显示出页面,很明显是减少了对服务器的请求次数,如果请求的页面数据流比较大,那么节省的性能是非常可观的,包括webQQ,基本上都采用这种方式了,确实不错。

 

本人根据这个想到另外一种思路

 

因为很多后台程序员还是习惯使用iframe

 

其实可以在整个系统软件的某一个不会改变的地方创建一个隐藏的div层,然后请求某一个页面的时候,动态创建一个iframe在div层里面,如果下次再请求这个iframe里面的链接地址的时候,就直接判断div层里面是否有这个iframe,如果有就直接显示,没有就创建,还有一点就是,如果iframe的数据是需要变化的,也可以动态移除iframe,从而来改变数据的正确性。

1
0
分享到:
评论

相关推荐

    13个css tab选项卡

    在网页设计中,CSS Tab选项卡是一种常见的交互元素,它允许用户通过点击...以上就是创建13个CSS Tab选项卡涉及的关键知识点,通过实践这些技巧,你可以构建出既美观又实用的Tab选项卡,提升网页的交互性和用户体验。

    非常好的一个tab选项卡

    【标题】:“非常好的一个tab选项卡”指的是在Web开发中常用的一种用户界面元素,它允许在单个容器内切换多个视图或内容区域。在VS2005(Visual Studio 2005)这个集成开发环境中,通过JavaScript实现的tab选项卡...

    HTML实现Tab选项卡(自动+手动)

    创建Tab选项卡的基础HTML结构通常包括两部分:一个是包含各个选项卡的容器,另一个是对应的面板内容区域。例如: ```html <li><a href="#tab1">选项卡1</a></li> <li><a href="#tab2">选项卡2</a></li> <li>...

    tab选项卡 很经典的选项卡

    "Tab选项卡"是这种交互模式的一种实现方式,通常在网页顶部或侧边设置,每个标签代表一个独立的内容区域。本文将深入探讨“经典”的选项卡设计及其重要特性。 一、选项卡的基本结构与功能 1. 标签:每个选项卡都...

    layui Tab选项卡切换跟随特效(源码)

    首先,layui的Tab选项卡是一个常见的页面布局元素,用于将大量内容组织成清晰、简洁的模块,用户可以通过点击不同的选项卡来切换显示的内容。这种功能在展示多层级信息或者避免页面过于拥挤时特别有用。在layui中,...

    不规则TAB选项卡JS代码

    在网页设计中,选项卡(TAB)是一种常见的用户界面元素,用于组织和展示大量信息,让用户可以方便地在不同内容间切换。不规则TAB选项卡JS代码是指使用JavaScript实现的一种具有独特设计风格的选项卡功能。JavaScript...

    tab选项卡的两个例子

    第一个可能是一个纯CSS实现的选项卡,利用`:checked`伪类和相邻选择器来切换内容的可见性。第二个例子可能引入了JavaScript,例如使用jQuery的`click`事件和`show/hide`方法,或者使用Vue.js的数据绑定和指令来实现...

    漂亮的JSP TAB选项卡

    "漂亮的JSP TAB选项卡"是一个专为提高用户体验而设计的组件,它在网页上以选项卡的形式组织内容,用户可以通过点击不同的选项卡来切换查看不同的页面部分。这种设计方式极大地优化了网页的布局,减少了页面滚动的...

    一个比较美观的圆角Tab选项卡切换效果

    一个比较美观的圆角Tab选项卡切换效果.html一个比较美观的圆角Tab选项卡切换效果.html一个比较美观的圆角Tab选项卡切换效果.html

    Android Tab 选项卡

    在本资源"Android Tab 选项卡"中,开发者提供了一个使用`Fragment`实现的Tab切换示例,这对于我们理解和实践Android应用的多视图管理有极大的帮助。 `Fragment`是Android系统中一个重要的组件,它代表了应用UI的一...

    TAB选项卡后台菜单效果

    "TAB选项卡后台菜单效果"是一个专为后台管理系统设计的功能,它旨在提供高效、直观且易于导航的操作界面。在这个主题下,我们将深入探讨选项卡在后台菜单中的应用、实现方式以及它们对用户体验的影响。 选项卡是一...

    html tab选项卡实现

    在网页设计中,选项卡(Tab)组件是一个常见的交互元素,它允许用户在不同的内容区域之间切换,而无需刷新整个页面。在这个主题中,我们将深入探讨如何使用 HTML 和 CSS 实现一个简洁的选项卡功能。 首先,HTML ...

    android Tab选项卡

    在Android开发中,"android Tab选项卡"是一个常见的用户界面元素,用于展示多个视图或功能区域,并且允许用户在这些区域之间轻松切换。通常,Tab选项卡的设计目的是提高用户体验,使得用户能快速访问和浏览应用程序...

    TAB选项卡示例介绍

    本文将深入探讨TAB选项卡的实现原理,功能特性,以及如何利用JavaScript和jQuery来构建一个动态且可定制的TAB选项卡组件。 #### 选项卡的核心功能 1. **多页面引用能力**:选项卡支持在同一个页面中多次引用,这...

    纯css3经典tab选项卡动画特效

    在Tab选项卡设计中,可以使用Flexbox轻松调整各个选项卡的排列和对齐,实现响应式设计。 5. Grid布局:虽然Tab选项卡设计通常不依赖Grid布局,但在某些复杂布局中,CSS Grid可以帮助更高效地组织内容区域,使其适应...

    tab选项卡切换效果,tab选项卡内容宽度自适应

    在网页设计中,"tab选项卡切换效果"是一种常见的用户界面设计模式,它允许用户在有限的空间内查看和切换不同的内容区域。这种效果通常用于显示大量相关但互斥的信息,如产品详情、用户评论或者设置选项。在这个项目...

    4种不同风格jQuery自定义tab选项卡特效.zip

    导航菜单可应用于头部和侧边,Tab选项卡提供多套风格,支持响应式,支持删除选项卡等功能。面包屑结构简单,支持自定义分隔符。这是tab选项卡切换的源代码,由于内容较多,所以只截取了大致的结构。其实第二个盒子...

    tab选项卡插件-面向对象

    本篇将深入探讨如何使用面向对象的方法来编写一个支持click和mouseover切换方式的tab选项卡插件。 首先,我们需要定义一个Tab类,这个类应该包含以下属性: 1. **选项卡标题列表**:存储所有选项卡的标题。 2. **...

    jquery tab选项卡插件 轻量级tab选项卡插件支持鼠标滑过、点击、自动切换、数据回调等功能

    在网页设计中,选项卡(Tab)是一种常见的用户界面元素,用于组织和展示大量信息。jQuery Tab 插件就是一种轻量级的解决方案,能够帮助开发者轻松实现多种交互功能,如鼠标滑过、点击切换、自动切换以及数据回调。本...

    css+div漂亮的圆角tab选项卡

    一个基本的tab选项卡结构通常包含一个容器(如`<div>`),里面嵌套着一组tab标题(可以是`<a>`或`<button>`标签)和与之对应的隐藏内容区域(例如`<div>`)。每个标题与对应的内容区域之间通过类名或ID进行关联,以...

Global site tag (gtag.js) - Google Analytics