JASMINECJC
JASMINECJC

回流和重绘

回流与重绘

1. 当render tree中的一部分(或全部)因为元素的规模尺寸，布局，隐藏等改变而需要重新构建。这就称为回流(reflow)。每个页面至少需要一次回流，就是在页面第一次加载的时候。在回流的时候，浏览器会使渲染树中受到影响的部分失效，并重新构造这部分渲染树，完成回流后，浏览器会重新绘制受影响的部分到屏幕中，该过程成为重绘。

2. 当render tree中的一些元素需要更新属性，而这些属性只是影响元素的外观，风格，而不会影响布局的，比如background-color。则就叫称为重绘。

注意：回流必将引起重绘，而重绘不一定会引起回流。

回流何时发生：

当页面布局和几何属性改变时就需要回流。下述情况会发生浏览器回流：

1、添加或者删除可见的DOM元素；

2、元素位置改变；

3、元素尺寸改变——边距、填充、边框、宽度和高度

4、内容改变——比如文本改变或者图片大小改变而引起的计算值宽度和高度改变；

5、页面渲染初始化；

6、浏览器窗口尺寸改变——resize事件发生时；

让我们看看下面的代码是如何影响回流和重绘的:

 
    
     
     
  1.  var  s  =  document.body.style;
    2.  
     
  2.  s.padding  =  "2px";  // 回流+重绘
    3.  
     
  3.  s.border  =  "1px solid red";  // 再一次 回流+重绘
    4.  
     
  4.  s.color  =  "blue";  // 再一次重绘
    5.  
     
  5.  s.backgroundColor  =  "#ccc";  // 再一次 重绘
    6.  
     
  6.  s.fontSize  =  "14px";  // 再一次 回流+重绘
    7.  
     
  7.  // 添加node，再一次 回流+重绘
    8.  
     
  8.  document.body.appendChild(document.createTextNode('abc!'));
    9.  
    
 
   
 
  
 
 
 
 
 
  说到这里大家都知道回流比重绘的代价要更高，回流的花销跟render tree有多少节点需要重新构建有关系，假设你直接操作body，比如在body最前面插入1个元素，会导致整个render tree回流，这样代价当然会比较高，但如果是指body后面插入1个元素，则不会影响前面元素的回流 
 
 
 
 
 
 
  
 聪明的浏览器
 
  
 从上个实例代码中可以看到几行简单的JS代码就引起了6次左右的回流、重绘。而且我们也知道回流的花销也不小，如果每句JS操作都去回流重绘的话，浏览器可能就会受不了。所以很多浏览器都会优化这些操作，浏览器会维护1个队列，把所有会引起回流、重绘的操作放入这个队列，等队列中的操作到了一定的数量或者到了一定的时间间隔，浏览器就会flush队列，进行一个批处理。这样就会让多次的回流、重绘变成一次回流重绘。
 
  
 虽然有了浏览器的优化，但有时候我们写的一些代码可能会强制浏览器提前flush队列，这样浏览器的优化可能就起不到作用了。当你请求向浏览器请求一些 style信息的时候，就会让浏览器flush队列，比如：
 
  
 1. offsetTop, offsetLeft, offsetWidth, offsetHeight
 
  
 2. scrollTop/Left/Width/Height
 
  
 3. clientTop/Left/Width/Height
 
  
 4. width,height
 
  
 5. 请求了getComputedStyle(), 或者 IE的 currentStyle
 
  

    当你请求上面的一些属性的时候，浏览器为了给你最精确的值，需要flush队列，因为队列中可能会有影响到这些值的操作。即使你获取元素的布局和样式信息跟最近发生或改变的布局信息无关，浏览器都会强行刷新渲染队列。 
  
 
 
 
 

   回流： 
 
 
 
 
  <body><div class="error">        <h4>我的组件</h4>        <p><strong>错误：</strong>错误的描述…</p>        <h5>错误纠正</h5>        <ol>                <li>第一步</li>                <li>第二步</li>        </ol></div> 
  
 
   </body> 
  
 
  
 
    
  
 
  
 
   在上面的HTML片段中，对该段落(<p>标签)回流将会引发强烈的回流，因为它是一个子节点。这也导致了祖先的回流（div.error和body – 视浏览器而定）。此外，h5和ol也会有简单的回流，因为其在DOM中在回流元素之后。就Opera而言，大部分的回流将导致页面的重新渲染。 
  
 
  
 
    
  
 
  
 
    
  
 
  
 
   避免回流降低性能影响 
  
 
  
 
   
 1. 直接改变className，如果动态改变样式，则使用cssText（考虑没有优化的浏览器）
 
   
 
   
     
    
  1.  // 不好的写法
    2.  
    
  2.  var  left  =  1;
    3.  
    
  3.  var  top  =  1;
    4.  
    
  4.  el.style.left  =  left  +  "px";
    5.  
    
  5.  el.style.top  =  top  +  "px";// 比较好的写法
    6.  
    
  6.  el.className  +=  " className1";
    7.  
    
  7.   
    8.  
    
  8.  // 比较好的写法
    9.  
    
  9.  el.style.cssText  +=  ";
    10.  
    
  10.  left:  " + left + "px;
    11.  
    
  11.  top:  " + top + "px;";
    12.  
   
 
   
 
    
 
     
  
    
 
    
 
     
 2. 让要操作的元素进行”离线处理”，处理完后一起更新
 
     
 
      a) 使用DocumentFragment进行缓存操作,引发一次回流和重绘；
 b) 使用display:none技术，只引发两次回流和重绘； 
      
 
       c) 使用cloneNode(true or false) 和 replaceChild 技术，引发一次回流和重绘； 
      
 
      
 
       
  
      
 
      
 
       
 3.不要经常访问会引起浏览器flush队列的属性，如果你确实要访问，利用缓存
 
       
 
       
     
        
  1.  // 别这样写，大哥
    2.  
        
  2.  for(循环)  {
    3.  
        
  3.  el.style.left  =  el.offsetLeft  +  5  +  "px";
    4.  
        
  4.  el.style.top  =  el.offsetTop  +  5  +  "px";
    5.  
        
  5.  }
    6.  
        
  6.   
    7.  
        
  7.  // 这样写好点
    8.  
        
  8.  var  left  =  el.offsetLeft,
    9.  
        
  9.  top  =  el.offsetTop,
    10.  
        
  10.  s  =  el.style;
    11.  
        
  11.  for  (循环)  {
    12.  
        
  12.  left  +=  10;
    13.  
        
  13.  top  +=  10;
    14.  
        
  14.  s.left  =  left  +  "px";
    15.  
        
  15.  s.top  =  top  +  "px";
    16.  
        
  16.  }
    17.  
       
 
       
 
        
 4. 让元素脱离动画流，减少回流的Render Tree的规模
 
        
 
        
     
         
  1.  $("#block1").animate({left:50});
    2.  
         
  2.  $("#block2").animate({marginLeft:50});
    3.  
        
 
        
 
         
 
          避免使用table布局 
         
 
         
 
          
  
         
 
         
 
          在布局完全建立之前，table经常需要多个关口，因为table是个和罕见的可以影响在它们之前已经进入的DOM元素的显示的元素。想象一下，因为表格最后一个单元格的内容过宽而导致纵列大小完全改变。这就是为什么所有的浏览器都逐步地不支持table表格的渲染（感谢Bill Scott提供）。然而有另外一个原因为什么表格布局时很糟糕的主意，根据 Mozilla 
          ，即使一些小的变化将导致表格(table)中的所有其他节点回流。 
         
 
        
 
       
 
      
 
     
 
    
 
   
 
  
 
 
 


                            

                        

                    

                    
                    

                    
                    
                    

                

                

                    
                

            

        

    

    

        
你可能感兴趣的:(dom,布局)

        

            

                
    
                    
  • 移动端网页布局注意事项及解决 1.winphone系统a、input标签被点击时产生的半透明灰色背景怎么去掉 
                        Ailsa-show

                        
    移动端网页布局注意事项及解决1.winphone系统a、input标签被点击时产生的半透明灰色背景怎么去掉1、关闭iOS键盘首字母自动大写2、禁止文本缩放html{-webkit-text-size-adjust:100%;}3、移动端如何清除输入框内阴影在iOS上，输入框默认有内部阴影，但无法使用box-shadow来清除，如果不需要阴影，可以这样关闭：input,textarea{border
    
                    
    • 
                    
  • PySimpleGUI模块用法的示例(从入门到进阶)
                        赵阿萌
java前端服务器linuxjavascript
                        
    入门版下面是几个全面展示PySimpleGUI模块用法的示例，并附有详细的代码注释，帮助你更好地掌握该模块的使用。示例1：简单的输入输出界面这是一个基础的GUI示例，展示了如何使用文本输入框、按钮和文本输出框。登录后复制importPySimpleGUIassg#定义布局layout=[[sg.Text("请输入您的名字：")],#标签组件[sg.InputText(key="-NAME-")],
    
                    
    • 
                    
  • Python点名器代码及打包教程
                        羽落惊鸿TQ
python开发语言
                        
    接下来再写一个功能性齐全稍微复杂一点的Python点名器程序，在原简易版的基础上增加历史记录功能、支持多种名单格式（CSV/Excel）、增加点名统计功能，并详细说明了将该程序打包成exe可执行文件的方法，以下是源代码，仅供学习参考：importtkinterastkfromtkinterimportttk, messagebox, filedialogimportrandomimportcsvi
    
                    
    • 
                    
  • 解析稳定率达99.99%！合合信息“大模型加速器2.0”助力AI打破“幻觉”
                        
算法大数据人工智能图表表格
                        
    随着大模型在社会应用中逐渐普及，人们在享受便利的同时，也面临着“AI幻觉”产生的风险。训练数据是影响大模型“认知能力”的关键要素，近期，上海合合信息科技股份有限公司（简称“合合信息”）TextIn“大模型加速器2.0”版本正式上线，基于领先的智能文档处理技术，对复杂文档的版式、布局和元素进行精准解析及结构化处理，从数据源头降低大模型“幻觉”风险，让大模型在与人类的沟通中“更靠谱”。“大模型加速器2
    
                    
    • 
                    
  • JavaScript HTML DOM 节点列表
                        宇哥资料
JavaScriptjavascripthtml开发语言
                        
    NodeList对象是一个从文档中获取的节点列表(集合)。NodeList对象类似HTMLCollection对象。一些旧版本浏览器中的方法（如：getElementsByClassName()）返回的是NodeList对象，而不是HTMLCollection对象。所有浏览器的childNodes属性返回的是NodeList对象。大部分浏览器的querySelectorAll()返回NodeLis
    
                    
    • 
                    
  • 自主移动机器人模型制作
                        竹森科技-杨波
TecnomatixplantsimulationPlantSimulation沉思录java前端服务器
                        
    AGV搭载机械手的复合型机器人，主要用于将物流按要求输送至指定工位，可用于加工工件的抓取、组装、搬运、装卸等作业。此外，复合机器人也可快速布局于工厂、仓储分拣、自动化货物超市等诸多场景，为物料的自动搬运、物品的上下料，以及物料的分拣提供自动化、柔性化的作业支持，使厂内可以实现真正的无人搬运。现有的产品多是AGV+UR机械臂，在plant里面怎么去处理这个呢，接下来我们就针对这个问题进一步展开说明。
    
                    
    • 
                    
  • Vue.js 性能优化：虚拟 DOM 与虚拟滚动
                        vvilkim
vuevue.js前端javascript
                        
    在现代前端开发中，性能优化是一个永恒的话题。Vue.js作为一款流行的前端框架，提供了许多强大的工具和技术来提升应用的性能。其中，虚拟DOM和虚拟滚动是两个非常重要的概念。本文将深入探讨它们的原理、优势以及如何在Vue.js中使用它们来优化性能。什么是虚拟DOM？虚拟DOM（VirtualDOM）是Vue.js用于提升性能的核心技术之一。它是一个轻量级的JavaScript对象树，用于表示真实DO
    
                    
    • 
                    
  • 全网最详细！vue中使用flv.js 播放直播监控视频流
                        抄一下你代码
在vue中使用flv.js播放监控摄像头/直播vue.js
                        
    老规矩，先安装flv.js插件npminstallflv.js在组件中的使用**注意事项放后面我怕你们不看呐！！！！1.必须在dom加载完成后再执行直播视频流的填充方法！2.在一个网页中最多同时容纳6个监控视频播放！第七个绝对加载不出来！3.在离开这个页面的时候必须销毁播放容器，不然会占用TCP个数，导致其他页面的监控也播放不了**importflvjsfrom"flv.js";//页面代码//1
    
                    
    • 
                    
  • FPGA时序约束的概念和意义
                        学习永无止境@
FPGA设计fpgafpga开发开发语言
                        
    设计人员通过GUI输入时序约束，或者手动输入时序约束的方式告诉Vivado工具关于时钟或者IO接口的时序信息，用于协助Vivado工具在布局布线时尽可能的满足设计人员的时序要求，最大程度的保证Vivado工具每次生成的bit文件都具备良好的稳定性和适应性。
    
                    
    • 
                    
  • 3分钟带你了解Vue3的nextTick()
                        嫣嫣细语
vue.js前端javascriptvue.jsjavascript前端
                        
    前言Vue实现响应式并不是数据发生变化之后DOM立即变化，而是按一定的策略进行DOM的更新。简单来说，Vue在修改数据后，视图不会立刻更新，而是等同一事件循环中的所有数据变化完成之后，再统一进行视图更新，nextTick()方法就会在这样的DOM更新循环结束后调用指定的函数。概念在Vue3中nextTick()方法的行为和Vue2中基本相似，但它进行了一些优化，以提高性能和稳定性。nextTick
    
                    
    • 
                    
  • python数据可视化绘制图表（直方图，饼图圆环图，散点或气泡图，误差棒图）
                        2224070304
信息可视化python数据分析
                        
    一，直方图#先导入模块importnumpyasnp importmatplotlib.pyplotasplt#准备50个随机的数据scores=np.random.randint(0,100,50)#绘制直方图plt.hist(scores,bins=8,histtype='stepfilled')plt.show()其中，scores为数组（可为单个或多个的数列)bins=8,表示矩形的条数为
    
                    
    • 
                    
  • HTML中的零宽字符
                        Jinuss
前端html前端
                        
    概述零宽字符是一组在文本中没有可见宽度的字符，它们通常用于处理文本的布局、分隔和合成。下面是一些常见的零宽字符及其详细介绍：详细介绍零宽空格(ZeroWidthSpace,ZWSP)Unicode码位:U+200BHTML实体:或用途:用于防止文字自动换行。用于在文本中插入不可见的间隔，以控制排版或进行文本分析。零宽非连字符(ZeroWidthNon-Joiner,ZWNJ)Unicode码位:U
    
                    
    • 
                    
  • CLR 线程池
                        Jditinpc
windows
                        
    一、线程池基础线程池是应用程序能使用的线程集合。每CLR一个线程池；这个线程池由CLR控制的所有AppDomain共享。如果一个进程中加载了多个CLR，那么每个CLR都有它自己的线程池。CLR初始化时，线程池中没有线程。线程池维护了一个操作请求队列。创建和销毁线程是一个费时间的操作。应用程序执行一个异步操作时，就调用某个方法，将一个记录项追加到线程池的队列中。线程池的代码就从这个队列中提取记录项，
    
                    
    • 
                    
  • 前端解决跨域的几种方案
                        爱分享的程序员
前端前端
                        
    以下是前端解决跨域问题的7种主流方案，根据应用场景和实现难度排序，附详细实现示例：一、开发环境解决方案1.WebpackDevServer代理（推荐）//vue.config.js/webpack.config.jsmodule.exports={devServer:{proxy:{'/api':{target:'http://backend-domain.com',//后端地址changeOri
    
                    
    • 
                    
  • react 技术栈请问该如何优化 DOM 大小
                        混血哲谈
react.js前端前端框架
                        
    针对React应用中DOM大小过大的问题，以下是详细的优化方案和具体操作步骤，帮助你提升Lighthouse性能评分和用户体验：一、问题根源分析DOM大小过大（如超过1500个节点或深度超过32层）会导致：渲染性能下降：浏览器解析和渲染DOM的时间增加。内存占用过高：大量DOM节点占用更多内存，影响低端设备表现。交互延迟：事件监听器绑定过多节点时，响应变慢。常见原因：未优化的列表渲染（如长列表一次
    
                    
    • 
                    
  • 【存储中间件】Redis核心技术与实战（六）：Redis的设计与实现（缓存淘汰算法、过期策略与惰性删除）
                        道友老李
#Redis核心技术与实战架构师进阶-存储中间件缓存中间件redis
                        
    文章目录Redis的设计与实现缓存淘汰算法maxmemoryNoevictionvolatile-lruvolatile-ttlvolatile-randomallkeys-lruallkeys-randomLRU算法近似LRU算法LFU算法为什么Redis要缓存系统时间戳过期策略和惰性删除过期惰性删除lazyfree个人主页：道友老李欢迎加入社区：道友老李的学习社区Redis的设计与实现缓存淘汰
    
                    
    • 
                    
  • UI设计中的负空间：提示和最佳实践
                        weixin_34346099

                        
    我们常常认为沉默，空虚或无色对我们不利。我们认为它们是理所当然的，而不认为它们是对比的坚实基础。只有沉默让我们知道声音的价值。只有空白空间才能让我们了解我们想要填充它的内容。只有无色才能让我们在舞台上出现时感觉颜色更明亮更深。只有缺乏空气才能让我们知道它的重要性。今天我们谈论的是设计中的空气，让我们讨论下什么是负空间。什么是设计中的负空间？基本上，负空间或通常称为空白区域-是布局的空白区域。它不仅
    
                    
    • 
                    
  • 从 0 到 1 搭建一个 Web 应用项目：详细步骤与踩坑记录
                        算法探索者
前端
                        
    一、引言在当今数字化时代，Web应用无处不在。对于开发者而言，掌握从0到1搭建Web应用项目的技能至关重要。本指南将带你逐步完成一个简单Web应用项目的搭建，分享技术选型思路以及在过程中遇到的问题和解决方案，助力你开启Web开发之旅。二、技术选型（一）前端框架：选择React.js。它具有高效的虚拟DOM机制，能够快速更新页面，提升用户体验。同时，React生态系统丰富，有大量现成的组件库和工具可
    
                    
    • 
                    
  • 浏览器 DOM 深度解析：从节点类型到遍历操作的全攻略
                        码农的时光故事
javascript开发语言ecmascript
                        
    一、DOM核心概念与节点类型DOM（文档对象模型）是浏览器提供的核心API之一，用于将HTML文档转换为可操作的对象树结构。其核心设计遵循树形结构，每个节点都继承自Node接口，主要分为以下类型：1.基础节点类型Element：对应HTML标签，包含属性和子节点（）Text：文本内容节点Comment：注释节点Document：文档根节点，通过document全局对象访问（）2.特殊节点类型Doc
    
                    
    • 
                    
  • 浏览器工作原理深度解析（阶段一）：从 URL 到页面渲染的完整流程
                        码农的时光故事
javascript前端
                        
    一、浏览器工作流程概述作为前端开发者，我们每天都在与浏览器打交道，但多数人对其内部工作机制却知之甚少。实际上，浏览器的核心功能就是将用户输入的URL转换为可视化的网页。这一过程大致分为六个关键步骤：网络请求：通过HTTP/HTTPS协议获取页面资源构建DOM树：解析HTML代码生成文档对象模型样式计算：解析CSS规则并应用到对应元素布局渲染：计算元素位置和尺寸生成渲染树合成优化：将渲染层合并为位图
    
                    
    • 
                    
  • JavaScript对象全解析：从宿主到内置，深入理解对象分类
                        码农的时光故事
前端javascript
                        
    一、JavaScript对象全景图JavaScript对象系统远比表面看起来复杂，我们可以将其分为以下五大类：类别描述示例宿主对象由运行环境提供的对象（如浏览器中的DOM）window、document固有对象标准规定随运行时自动创建的基础对象Array、Date原生对象通过内置构造器创建的特权对象newArray()、newMap()普通对象用户创建的常规对象{}、newObject()特殊行为
    
                    
    • 
                    
  • MATLAB中的APPdesigner绘制多图问题解析？与逻辑值转成十进制
                        Ndmzi
Matlabmatlab开发语言
                        
    在matlabAPPdesigner中绘图可以用UIAxes组件进行绘图，但是当想多张图时，只能提前绘制图像区域不方便。下面是几种办法：为了操作可以添加Panl组件，方便操作。1、当是要求的几个图像大小都是相同时刻采用函数：tiledlayout创建分块图布局tiledlayout(m,n)tiledlayout('flow')tiledlayout(___,Name,Value)tiledlay
    
                    
    • 
                    
  • FDTD：基于Python的电磁场模拟开源库教程
                        邱进斌Olivia

                        
    FDTD：基于Python的电磁场模拟开源库教程项目地址:https://gitcode.com/gh_mirrors/fd/fdtd项目介绍FDTD（Finite-DifferenceTime-Domain）是一个致力于电磁场仿真的开源项目，由flaport维护。此项目基于Python语言，提供了一套灵活且强大的工具集，用于解决各种电磁学问题，包括但不限于光学、射频以及微波工程中的传播、散射等问
    
                    
    • 
                    
  • 八股文-C++ 运行时多态与函数调用机制详解
                        tt555555555555
面经C++学习c++开发语言
                        
    C++运行时多态与函数调用机制详解1.重载与覆盖的对比重载示例覆盖示例2.运行时多态的本质3.虚函数表的实现机制代码示例运行结果虚函数表(vtable)和虚指针(vptr)的实现Base类的内存布局Derived类的内存布局动态绑定的过程4.关键问题解答为什么`Base`的析构函数需要是`virtual`？虚函数表是否会影响性能？5.C语言的函数调用过程栈帧(StackFrame)的结构栈帧的创建
    
                    
    • 
                    
  • 高云FPGA的管脚约束文件的复制
                        在岸上走的鱼
fpga开发嵌入式硬件硬件架构
                        
    问：Gowin里面能不能直接拷贝一个管脚约束文件进去用？答：可以直接拷贝，但是拷贝前后两个工程对应的芯片必须要是同一个芯片拷贝方法:第一步：按照被拷贝约束文件对应的芯片新建一个工程，然后将原工程文件夹“src”里面的“.cst”文件拷到新建工程的相同目录下，第二步：回到新建工程目录下，点击芯片名右击，如下图：将“.V”文件和“.cst”文件一同加入这个工程，最后综合，布局布线就可以了，注意：有时拷
    
                    
    • 
                    
  • 深度解析 React useRef Hook 的使用
                        Jason Ma丶丶前端工程师
Reactjavascriptreact.jsjavascript前端
                        
    useRef返回一个可变的ref对象，其.current属性被初始化为传入的参数（initialValue）。返回的ref对象在组件的整个生命周期内持续存在。命令式地获取及操作DOM：functionTextInputWithFocusButton(){ //通过useRef创建并获取Dom元素 constinputEl=useRef(null);   constonButtonClick=()=
    
                    
    • 
                    
  • 解释 一下什么是 React 的 useRef Hook
                        祈澈菇凉
react.jsjavascript前端
                        
    useRef是React中的一个Hook，用于创建一个可以持久化存储的可变引用。它通常用于访问DOM元素或保存任何可变值，而不触发组件的重新渲染。本文将详细介绍useRef的定义、用法、适用场景及最佳实践。1.什么是useRef？1.1定义useRef是一个Hook，用于创建一个可变的引用对象。它返回一个包含.current属性的对象，.current属性可以用来存储任何值。与组件的状态（stat
    
                    
    • 
                    
  • 【CSS】实现三栏布局的方式
                        儒rs
CSScsscss3html三栏布局前端
                        
    【CSS】实现三栏布局的方式三栏布局一般指的是页面中一共有三栏，左右两栏宽度固定，中间自适应的布局，三栏布局的具体实现如下：①利用浮动利用浮动，左右两栏设置固定大小，并设置对应方向的浮动。中间一栏设置左右两个方向的margin值。注意这种方式，中间一栏必须放到最后。.container{overflow:hidden;}.left{float:left;width:100px;background
    
                    
    • 
                    
  • 12.12【java exp4】react table全局搜索tailwindcss 布局 (Layout) css美化 3. (rowId: number
                        CQU_JIAKE
CQUCSjavascript前端react.js
                        
    reacttable创建一个下拉菜单，允许用户选择要搜索的列。创建一个输入框，用于输入搜索关键词。根据用户的选择，动态地应用过滤器到指定的列全局搜索importReactfrom'react';import{useTable,useFilters,useGlobalFilter,useSortBy,usePagination}from'react-table';//自定义过滤组件functionC
    
                    
    • 
                    
  • [科普] SRAM 和 PSRAM 易失性存储器（断电后数据丢失）(由DS-R1生成)
                        兴趣使然_
嵌入式硬件相关fpga开发
                        
    在易失性存储器（断电后数据丢失）中，SRAM和PSRAM是两种常见的高速存储方案，但它们的技术原理和应用场景有明显差异。以下是详细对比和扩展说明：1.SRAM（StaticRandom-AccessMemory）核心特性静态存储：通过6晶体管（6T）锁存结构存储数据，无需外部刷新电路，数据在通电时永久保持。速度：读写速度极快（纳秒级延迟），远高于DRAM或Flash，常见于高速缓存场景。功耗：静态
    
                    
    • 
                                
  • eclipse maven
                                    IXHONG
eclipse
                                    
    eclipse中使用maven插件的时候，运行run as maven build的时候报错 
-Dmaven.multiModuleProjectDirectory system propery is not set. Check $M2_HOME environment variable and mvn script match. 
  
可以设一个环境变量M2_HOME指
    
                                
    • 
                                
  • timer cancel方法的一个小实例
                                    alleni123
多线程timer
                                    
    package com.lj.timer;

import java.util.Date;
import java.util.Timer;
import java.util.TimerTask;

public class MyTimer extends TimerTask
{

	private int a;
	
	private Timer timer;
	
	pub
    
                                
    • 
                                
  • MySQL数据库在Linux下的安装
                                    ducklsl
mysql
                                    
    1.建好一个专门放置MySQL的目录 
/mysql/db数据库目录 
/mysql/data数据库数据文件目录 
 
2.配置用户，添加专门的MySQL管理用户 
 
>groupadd mysql ----添加用户组
>useradd -g mysql mysql ----在mysql用户组中添加一个mysql用户 
3.配置，生成并安装MySQL 
 
>cmake -D
    
                                
    • 
                                
  • spring------>>cvc-elt.1: Cannot find the declaration of element
                                    Array_06
springbean
                                    
    将-------- 
 
<?xml version="1.0" encoding="UTF-8"?> 
<beans xmlns="http://www.springframework.org/schema/beans" 
    xmlns:xsi="http://www.w3
    
                                
    • 
                                
  • maven发布第三方jar的一些问题
                                    cugfy
maven
                                    
    maven中发布 第三方jar到nexus仓库使用的是 deploy:deploy-file命令 
 
有许多参数，具体可查看 
 
http://maven.apache.org/plugins/maven-deploy-plugin/deploy-file-mojo.html 
 
以下是一个例子： 
 
mvn  deploy:deploy-file -DgroupId=xpp3 
    
                                
    • 
                                
  • MYSQL下载及安装
                                    357029540
mysql
                                    
        好久没有去安装过MYSQL，今天自己在安装完MYSQL过后用navicat for mysql去厕测试链接的时候出现了10061的问题，因为的的MYSQL是最新版本为5.6.24，所以下载的文件夹里没有my.ini文件，所以在网上找了很多方法还是没有找到怎么解决问题，最后看到了一篇百度经验里有这个的介绍，按照其步骤也完成了安装，在这里给大家分享下这个链接的地址
    
                                
    • 
                                
  • ios TableView cell的布局
                                    张亚雄
tableview
                                    
      cell.imageView.image = [UIImage imageNamed:[imageArray objectAtIndex:[indexPath row]]]; 
    
  
    CGSize itemSize = CGSizeMake(60, 50); 
 
  &nbs
    
                                
    • 
                                
  • Java编码转义
                                    adminjun
java编码转义
                                    
        import java.io.UnsupportedEncodingException;

    /**
    * 转换字符串的编码
    */
    public class ChangeCharset {
    /** 7位ASCII字符，也叫作ISO646-US、Unicode字符集的基本拉丁块 */
    public static final Strin
    
                                
    • 
                                
  • Tomcat 配置和spring
                                    aijuans
spring
                                    
    简介 
Tomcat启动时，先找系统变量CATALINA_BASE，如果没有，则找CATALINA_HOME。然后找这个变量所指的目录下的conf文件夹，从中读取配置文件。最重要的配置文件：server.xml 。要配置tomcat，基本上了解server.xml，context.xml和web.xml。 
 
 Server.xml --  tomcat主
    
                                
    • 
                                
  • Java打印当前目录下的所有子目录和文件
                                    ayaoxinchao
递归File
                                    
    其实这个没啥技术含量，大湿们不要操笑哦，只是做一个简单的记录，简单用了一下递归算法。 
  
import java.io.File;

/**
 * @author Perlin
 * @date 2014-6-30
 */
public class PrintDirectory {
	
	public static void printDirectory(File f
    
                                
    • 
                                
  • linux安装mysql出现libs报冲突解决
                                    BigBird2012
linux
                                    
    linux安装mysql出现libs报冲突解决 
安装mysql出现 
file /usr/share/mysql/ukrainian/errmsg.sys from install of MySQL-server-5.5.33-1.linux2.6.i386 conflicts with file from package mysql-libs-5.1.61-4.el6.i686 
 
    
                                
    • 
                                
  • jedis连接池使用实例
                                    bijian1013
redisjedis连接池jedis
                                    
    实例代码： 
package com.bijian.study;

import java.util.ArrayList;
import java.util.List;

import redis.clients.jedis.Jedis;
import redis.clients.jedis.JedisPool;
import redis.clients.jedis.JedisPoo
    
                                
    • 
                                
  • 关于朋友
                                    bingyingao
朋友兴趣爱好维持
                                    
      成为朋友的必要条件： 
   志相同，道不合，可以成为朋友。譬如马云、周星驰一个是商人，一个是影星，可谓道不同，但都很有梦想，都要在各自领域里做到最好，当他们遇到一起，互相欣赏，可以畅谈两个小时。   
  志不同，道相合，也可以成为朋友。譬如有时候看到两个一个成绩很好每次考试争做第一，一个成绩很差的同学是好朋友。他们志向不相同，但他
    
                                
    • 
                                
  • 【Spark七十九】Spark RDD API一
                                    bit1129
spark
                                    
    aggregate 
package spark.examples.rddapi

import org.apache.spark.{SparkConf, SparkContext}

//测试RDD的aggregate方法
object AggregateTest {
  def main(args: Array[String]) {
    val conf = new Spar
    
                                
    • 
                                
  • ktap 0.1 released
                                    bookjovi
kerneltracing
                                    
    Dear,

I'm pleased to announce that ktap release v0.1, this is the first official
release of ktap project, it is expected that this release is not fully
functional or very stable and we welcome bu
    
                                
    • 
                                
  • 能保存Properties文件注释的Properties工具类
                                    BrokenDreams
properties
                                    
            今天遇到一个小需求：由于java.util.Properties读取属性文件时会忽略注释，当写回去的时候，注释都没了。恰好一个项目中的配置文件会在部署后被某个Java程序修改一下，但修改了之后注释全没了，可能会给以后的参数调整带来困难。所以要解决这个问题。 
    &nb
    
                                
    • 
                                
  • 读《研磨设计模式》-代码笔记-外观模式-Facade
                                    bylijinnan
java设计模式
                                    
    声明： 本文只为方便我个人查阅和理解，详细的分析以及源代码请移步 原作者的博客http://chjavach.iteye.com/ 
 
 



/*
 * 百度百科的定义：
 * Facade（外观）模式为子系统中的各类（或结构与方法）提供一个简明一致的界面，
 * 隐藏子系统的复杂性，使子系统更加容易使用。他是为子系统中的一组接口所提供的一个一致的界面
 * 
 * 可简单地
    
                                
    • 
                                
  • After Effects教程收集
                                    cherishLC
After Effects
                                    
    1、中文入门 
 
http://study.163.com/course/courseMain.htm?courseId=730009 
 
 2、videocopilot英文入门教程（中文字幕） 
 
http://www.youku.com/playlist_show/id_17893193.html 
英文原址： 
http://www.videocopilot.net/basic/ 
素
    
                                
    • 
                                
  • Linux Apache 安装过程
                                    crabdave
apache
                                    
    Linux Apache 安装过程 
  
下载新版本： 
apr-1.4.2.tar.gz（下载网站：http://apr.apache.org/download.cgi） 
apr-util-1.3.9.tar.gz（下载网站：http://apr.apache.org/download.cgi） 
httpd-2.2.15.tar.gz（下载网站：http://httpd.apac
    
                                
    • 
                                
  • Shell学习 之 变量赋值和引用
                                    daizj
shell变量引用赋值
                                    
    本文转自：http://www.cnblogs.com/papam/articles/1548679.html 
 
Shell编程中，使用变量无需事先声明，同时变量名的命名须遵循如下规则： 
 
首个字符必须为字母（a-z，A-Z） 
中间不能有空格，可以使用下划线（_） 
不能使用标点符号 
不能使用bash里的关键字（可用help命令查看保留关键字） 
需要给变量赋值时，可以这么写： 
 

    
                                
    • 
                                
  • Java SE 第一讲（Java SE入门、JDK的下载与安装、第一个Java程序、Java程序的编译与执行）
                                    dcj3sjt126com
javajdk
                                    
    Java SE 第一讲： 
 
Java SE：Java Standard Edition 
Java ME: Java Mobile Edition 
Java EE：Java Enterprise Edition 
 
Java是由Sun公司推出的（今年初被Oracle公司收购）。 
 
收购价格：74亿美金 
 
J2SE、J2ME、J2EE 
 
JDK：Java Development 
    
                                
    • 
                                
  • YII给用户登录加上验证码
                                    dcj3sjt126com
yii
                                    
    1、在SiteController中添加如下代码： 
    /**
     * Declares class-based actions.
     */
    public function actions() {
        return array(
            // captcha action renders the CAPTCHA image displ
    
                                
    • 
                                
  • Lucene使用说明
                                    dyy_gusi
Lucenesearch分词器
                                    
    Lucene使用说明 
1、lucene简介 
1.1、什么是lucene 
    Lucene是一个全文搜索框架，而不是应用产品。因此它并不像baidu或者googleDesktop那种拿来就能用，它只是提供了一种工具让你能实现这些产品和功能。 
1.2、lucene能做什么 
    要回答这个问题，先要了解lucene的本质。实际
    
                                
    • 
                                
  • 学习编程并不难,做到以下几点即可!
                                    gcq511120594
数据结构编程算法
                                    
    不论你是想自己设计游戏，还是开发iPhone或安卓手机上的应用，还是仅仅为了娱乐，学习编程语言都是一条必经之路。编程语言种类繁多，用途各 异，然而一旦掌握其中之一，其他的也就迎刃而解。作为初学者，你可能要先从Java或HTML开始学，一旦掌握了一门编程语言，你就发挥无穷的想象，开发 各种神奇的软件啦。 
1、确定目标 
学习编程语言既充满乐趣，又充满挑战。有些花费多年时间学习一门编程语言的大学生到
    
                                
    • 
                                
  • Java面试十问之三：Java与C++内存回收机制的差别
                                    HNUlanwei
javaC++finalize()堆栈内存回收
                                    
    大家知道， Java 除了那 8 种基本类型以外，其他都是对象类型（又称为引用类型）的数据。 JVM 会把程序创建的对象存放在堆空间中，那什么又是堆空间呢？其实，堆（ Heap）是一个运行时的数据存储区，从它可以分配大小各异的空间。一般，运行时的数据存储区有堆（ Heap）和堆栈（ Stack），所以要先看它们里面可以分配哪些类型的对象实体，然后才知道如何均衡使用这两种存储区。一般来说，栈中存放的
    
                                
    • 
                                
  • 第二章 Nginx+Lua开发入门
                                    jinnianshilongnian
nginxlua
                                    
    Nginx入门 
本文目的是学习Nginx+Lua开发，对于Nginx基本知识可以参考如下文章： 
nginx启动、关闭、重启 
http://www.cnblogs.com/derekchen/archive/2011/02/17/1957209.html 
agentzh 的 Nginx 教程 
http://openresty.org/download/agentzh-nginx-tutor
    
                                
    • 
                                
  • MongoDB windows安装 基本命令
                                    liyonghui160com

                                    
      
windows安装 
  
 安装目录： 
  
D:\MongoDB\ 
  
新建目录 
  
D:\MongoDB\data\db 
  
4.启动进城： 
  
cd D:\MongoDB\bin 
  
mongod -dbpath D:\MongoDB\data\db 
  
&n
    
                                
    • 
                                
  • Linux下通过源码编译安装程序
                                    pda158
linux
                                    
    一、程序的组成部分   　　Linux下程序大都是由以下几部分组成：   　　二进制文件：也就是可以运行的程序文件   　　库文件：就是通常我们见到的lib目录下的文件   　　配置文件：这个不必多说，都知道   　　帮助文档：通常是我们在linux下用man命令查看的命令的文档   　　 
二、linux下程序的存放目录   　　linux程序的存放目录大致有三个地方：   　　/etc, /b
    
                                
    • 
                                
  • WEB开发编程的职业生涯４个阶段
                                    shw3588
编程Web工作生活
                                    
    觉得自己什么都会 
2007年从学校毕业，凭借自己原创的ASP毕业设计，以为自己很厉害似的，信心满满去东莞找工作，找面试成功率确实很高，只是工资不高，但依旧无法磨灭那过分的自信，那时候什么考勤系统、什么OA系统、什么ERP，什么都觉得有信心，这样的生涯大概持续了约一年。 
 
根本不是自己想的那样 
2008年开始接触很多工作相关的东西，发现太多东西自己根本不会，都需要去学，不管是asp还是js，
    
                                
    • 
                                
  • 遭遇jsonp同域下变作post请求的坑
                                    vb2005xu
jsonp同域post
                                    
    今天迁移一个站点时遇到一个坑爹问题,同一个jsonp接口在跨域时都能调用成功,但是在同域下调用虽然成功,但是数据却有问题. 此处贴出我的后端代码片段 
$mi_id = htmlspecialchars(trim($_GET['mi_id ']));
$mi_cv = htmlspecialchars(trim($_GET['mi_cv '])); 
 贴出我前端代码片段: 
$.aj
    
                                
    • 
                

            

        

    




    

        

            按字母分类：
            ABCDEFGHIJKLMNOPQRSTUVWXYZ其他