暗影刀客
暗影刀客

web常见性能优化总结（浏览器渲染过程详解）

文章目录

        • 一、什么是web的性能优化
        • 二、web性能优化的目的
        • 三、web性能优化的原理
          • 3.1 加载文档
          • 3.2 生成dom树
          • 3.3 加载css 和js
          • 3.4 生成CSS OM
          • 3.5 rending tree
          • 3.6 layout（flow 、reflow）
          • 3.7 paint（repaint）
          • 3.8 composite （合并）
        • 四、性能优化
          • 4.1 html的语义化编程
          • 4.2 资源的加速
          • 4.3 js的优化
          • 4.4 CSSOM 优化
          • 4.5 dom操作节流
          • 4.6 加载渲染分流
          • 4.7 避免repaint和reflow

一、什么是web的性能优化

web的性能指标有很多，大致可以分为三类：

  1. 首次访问速度。首次访问速度主要指首页的加载速度，这个在移动端显得尤为可贵，对于大厂的h5 app，这一块的优化一直都是头疼的问题，例如淘宝首页，手百首页等等，让用户多看几百毫秒的白屏，都会让pm逼死一帮程序猿。
  2. 持续访问速度。持续访问速度更多指对于CPU，GPU，内存等资源的使用，使用过程中的是否有卡顿，是否保持流畅等等。
  3. web的健壮性。健壮是指，对于对于并发，大量请求和访问，web安全等等极端情况下web的可用性。

这次我们要讲的是主要是第一点，首次加载时，web性能的优化，这也是一版前端面试会的常考点。之后的web 性能优化均指的是第一点。

二、web性能优化的目的

  1. 优化用户体验，提升用户留存率。有人研究过：2秒之内，95%以上的实验者保持良好的注意力，3秒之后注意力开始分散；当等待时间超过5秒，70%的实验者能保持良好的注意力；当等待时间超过9秒，仅剩下20%能保持良好的注意力，对于不同首屏加载等待时间对于用户的留存，每个大厂不尽相同，但是大家都不知觉的精确到毫秒级，重要性可想而知。
  2. 提升web的SEO排名。在17年10月，百度就推出了对于首评加载时长超过3秒的web，降低其权重的“闪电算法”

三、web性能优化的原理

web性能的优化的原理，不得不提到浏览器在加载web首页时做的工作了，我们搞清楚了他的工作步骤，才能知道优化的点在哪里。下图是浏览器渲染的几个步骤：
web常见性能优化总结（浏览器渲染过程详解）_第1张图片
上图中有几点需要我们注意一下：
3. DOM和CSS OM是有先后开始，但是在过程中是可以(注意是可以，不是一定，也不是不行)同步进行的
4. DOM和CSSOM 都和js的解析是互斥的，这个很好理解，js可以修改dom节点或者css样式，所以js会阻塞其他两个的进程，直至js执行完毕
那么他的执行顺序大致可以这么看
web常见性能优化总结（浏览器渲染过程详解）_第2张图片
下面我们结合chorme的新增功能performance(控制台>performance)来对于每一个步骤的工作进行分析：
web常见性能优化总结（浏览器渲染过程详解）_第3张图片

3.1 加载文档

常见的浏览器文档类型有，HTML、XHTML、SVG，XML，在用户打开浏览器的时候，首先要做的是解析域名和dns，找到对应的IP，然后通过校验之后，像服务器发起请求，服务器相应的内容就是要加载的文档。
web常见性能优化总结（浏览器渲染过程详解）_第4张图片

3.2 生成dom树

这个过程主要是把文档解析成DOCUMENT OBJECT，例如html的 ，这个结构的解析，浏览器内置的都可以直接解析这些文档，不用依赖任何其他的文件，所以这个过程会很快，最终生成表示能够表示整个文档和每个节点的类型，数据和节点关系的树形结构，简称dom树。
web常见性能优化总结（浏览器渲染过程详解）_第5张图片
需要注意一点：这里是全部的node节点，即使

该节点会依然在dom树中存在
web常见性能优化总结（浏览器渲染过程详解）_第6张图片

3.3 加载css 和js

这个之所以会算作一个过程，是因为随着web的发展，很多web越来越大，功能也越来越复杂，引入的css和js也越来越多，在整个页面中也慢慢的占据一定的位置。
5. 加载css包括 html中的css代码块，内联样式，和需要下载的外部样式
6. js 主要指下载外部引入的js文件

3.4 生成CSS OM

CSSOM是将对应的样式绑定到对应的节点上，为什么会有树的概念，个人理解，cssom tree有点像树上开的花，来表示节点的属性，而且树的根节点和子节点，也很好的表示了css的优先级，比如父布局的一些样式对于子样式的影响，但是在css om tree中并不是最终的样式。

  1. 是用户代理样式的重新计算
  2. 不包含所有的dom节点

web常见性能优化总结（浏览器渲染过程详解）_第7张图片
web常见性能优化总结（浏览器渲染过程详解）_第8张图片

3.5 rending tree

这个过程是DOM和CSS OM合并的过程，这个过程中主要做：

  1. 去除dom树中和页面渲染无关的节点，比如head 、mate等
  2. 计算和合并cssOm，并应用到dom树上
  3. 从dom树上去除display：none的节点，visiable：false的不会移除

这样就生成了rend tree。

3.6 layout（flow 、reflow）

这个过程成为layout或者flow，布局，主要是来计算每个node的尺寸，位置和颜色等信息，为了下一步的绘制作准备，因为这个过程并不是只执行一次，比如js解析的时候，调整某一个node节点的尺寸或者位置，就会导致重新计算，所以也可以成为reflow。
影响重新布局的原因如下：

  1. 节点的增改
  2. 节点样式的修改（不是全部，比如背景色就不会导致重新布局）
  3. 用户发起的事件，鼠标事件等等

web常见性能优化总结（浏览器渲染过程详解）_第9张图片

3.7 paint（repaint）

绘制，原因和上方相同，都不止一次，会应为reflow，导致repaint。这里需要注意一点，paint的绘制是多线程分块进行的，可以在下图的三 看到，多个绘制并发进行。
web常见性能优化总结（浏览器渲染过程详解）_第10张图片

3.8 composite （合并）

从3.7可以看到，分层绘制，带来了并行，提升了效率，但是最后需要将绘制的结果合并成一个页面，呈现给用户。

讲到这里渲染的原理基本差不多了，接下来，才进入正题，我想，你如果看到这里，应该也能想到很多可以优化的点了。

四、性能优化

我们的性能也是会结果上面的步骤，进行阐述，对应这个阶段的优化点哦。

4.1 html的语义化编程

语义化标签是浏览器内置就能解析识别的标签，最终的实现也会dom的结构简洁话，所以就会减少时间消耗哦

4.2 资源的加速
  1. 静态资源的cnd加速
  2. 图片资源的压缩
  3. 合并资源请求，虽然会增加单个请求的时间，但是发起请求，关闭请求的操作，很耗费资源。
  4. css资源的分片加载，最常见的就是

media属性可以接受一个或多个媒体值表，浏览器会根据当前的媒体值，来加载对应的样式表，这样就要比把所有的样式放在同一个样式文件中要来的好

  1. js的异步加载
    js文件的异步加载，一个页面的初始化中，因为很多时候外部的js文件相对大小还是不小的，如果这些文件不着急执行，可以添加这个属性，表示异步加载，不会阻塞其他的操作

你可能感兴趣的:(学习记录,分享,javascript,web性能优化,渲染)

  • 2、3ds Max的界面（3DMAX基础自学系列） weixin_34409703
    一、3dsMax2012中文版的操作界面二、各功能区的介绍1、菜单栏菜单栏位于软件界面顶部，共13个，分别是文件、编辑(E)、工具(T)、组(G)、视图(V)、创建(C)、修改器、动画、图标编译器、渲染(R)、自定义(U)、MAXScript(M)、帮助(H)。可以使用ALT+菜单的字母来打开菜单。①文件左上角的Max图标为文件操作入口，旁边为文件操作的快捷按钮，包含用于管理文件的命令，包括创建、
  • 【C语言--趣味游戏系列】--电脑关机整蛊小游戏 User_芊芊君子 C语言内容概括c语言游戏电脑
    前言：老铁们，还是那句话，学习很苦游戏来补，为了提高大家与朋友之间的友谊，博主在这里分享一个电脑关机的恶作剧小游戏，快拿去试试吧！！！目录：1.电脑关机代码2.详解1.电脑关机代码#define_CRT_SECURE_NO_WARNINGS#include#include#includeintmain(){charinput[20]={0};system("shutdown-s-t60");whi
  • Flutter三棵树是什么，为什么这么设计 Ever69 Flutter《葵花宝典》flutter三棵树
    目录1.三棵树的定义与职责(1)Widget树(2)Element树(3)RenderObject树2.三棵树的协同工作流程3.为什么设计三棵树？(1)性能优化(2)逻辑解耦(3)灵活性4.三棵树的设计优势总结示例：动态列表更新常见面试追问Flutter的「三棵树」是其核心设计之一，用于高效管理UI的构建、更新和渲染。它们分别是Widget树、Element树和RenderObject树。这种分层
  • DataEase：一款国产开源数据可视化分析工具 不剪发的Tony老师 编程技能BI数据分析DataEase
    DataEase是由飞致云开发的一款基于Web的数据可视化BI工具，支持丰富的数据源连接，能够通过拖拉拽方式快速制作图表，帮助用户快速分析业务数据并洞察其趋势，为企业的业务改进与优化提供支持。DataEase的优势在于：开源开放：零门槛，线上快速获取和安装，按月迭代；简单易用：极易上手，通过鼠标点击和拖拽即可完成分析；全场景支持：跨平台安装和多样化嵌入支持；安全分享：支持多种数据分享方式，确保数据
  • python实现数据库存储过程_Python通过调用mysql存储过程实现更新数据功能示例 食色也 python实现数据库存储过程
    本文实例讲述了Python通过调用mysql存储过程实现更新数据功能。分享给大家供大家参考，具体如下：一、需求分析由于管理费率配置错误，生成订单的还本付息表和订单表的各种金额，管理费之间的计算都有错误，需要进行数据订正。为此，为了造个轮子，以后省很多功夫，全部用程序去修正，不接入人工。二、带参数mysql存储过程创建1、更新订单付息表(t_order_rapay)dropprocedureifex
  • 【商城实战(36)】UniApp性能飞升秘籍：从渲染到编译的深度优化 奔跑吧邓邓子 商城实战uni-app商城实战性能优化
    【商城实战】专栏重磅来袭！这是一份专为开发者与电商从业者打造的超详细指南。从项目基础搭建，运用uniapp、ElementPlus、SpringBoot搭建商城框架，到用户、商品、订单等核心模块开发，再到性能优化、安全加固、多端适配，乃至运营推广策略，102章内容层层递进。无论是想深入钻研技术细节，还是探寻商城运营之道，本专栏都能提供从0到1的系统讲解，助力你打造独具竞争力的电商平台，开启电商实战
  • PyQt6嵌入HTML5内容教程 mosquito_lover1 pythonpyqthtml5
    在PyQt6中嵌入HTML5内容可以通过QWebEngineView实现。QWebEngineView是一个基于Chromium的浏览器引擎，能够渲染HTML5内容。以下是一个简单的示例，展示如何在PyQt6中嵌入HTML5页面：1.安装PyQt6和PyQt6-WebEnginepipinstallPyQt6PyQt6-WebEngine2.创建PyQt6应用程序并嵌入HTML5内容imports
  • Spring有哪些缺点? java1234_小锋 javajava面试开发语言
    大家好，我是锋哥。今天分享关于【Spring有哪些缺点?】面试题。希望对大家有帮助；Spring有哪些缺点?1000道互联网大厂Java工程师精选面试题-Java资源分享网Spring是一个非常流行的Java框架，提供了丰富的功能和灵活的配置选项，广泛应用于企业级应用开发。然而，尽管Spring有许多优点，但它也存在一些缺点和挑战，以下是一些常见的缺点：1.学习曲线较陡峭Spring框架包含了大量
  • 【Python】已解决：pip安装第三方模块（库）与PyCharm中不同步的问题（PyCharm添加本地python解释器） 屿小夏 pythonpippycharm
    个人简介：某不知名博主，致力于全栈领域的优质博客分享|用最优质的内容带来最舒适的阅读体验！文末获取免费IT学习资料！文末获取更多信息精彩专栏推荐订阅收藏专栏系列直达链接相关介绍书籍分享点我跳转书籍作为获取知识的重要途径，对于IT从业者来说更是不可或缺的资源。不定期更新IT图书，并在评论区抽取随机粉丝，书籍免费包邮到家AI前沿点我跳转探讨人工智能技术领域的最新发展和创新，涵盖机器学习、深度学习、自然
  • html css 笔记 小箌 htmlcss笔记
    01_浏览器相关知识五大主流浏览器：ChromeSafariIEFirefoxOpera(拥有自己的内核)四大内核:webkitTridentGeckoblink.02_网页相关知识构成网址网站网页网页标准：结构表现行为分别对应HTMLCSSJavaScript03_HTML简介HTML是什么译为：标记语言超文本：比普通的文本信息含量更多04_HTML初体验保存：Ctrl+S后缀：.html程序员
  • 到底选谁？oelove 婚恋系统10.0和金媒10.3都升级了 weixin_wx520-1983 小程序
    目前都是婚庆类程序的佼佼者，两套系统很多网友不知道选哪个！我分享下我的建议，两套系统我都有目前OElove旗舰版（含商城插件+情感系统插件）金媒最新也是10.3旗舰版。1.对比性能架构两套系统我都在用，性能方面的话OElove因为非全开源所以运行效率要低一些特别是早期5.0之前版本运行期来就更慢了，体验滑坡，后来官方又把架构重新写了一边速度块了很多，金媒程序本身是全开源所以运行没问题。2.功能和稳
  • JavaScript基础-对象的相关概念 難釋懷 javascript开发语言
    在JavaScript编程中，对象（Object）是一个核心的概念，它几乎无处不在。无论是简单的键值对存储还是复杂的自定义数据结构，对象都提供了强大的功能来组织和操作数据。本文将介绍JavaScript中对象的基本概念、创建方法以及一些常见的操作技巧。一、什么是对象？在JavaScript中，对象是一种复合数据类型，它可以包含属性（properties），每个属性由一个键（key）和一个值（val
  • Godot引擎开发：UI和用户交互_用户界面性能优化 chenlz2007 游戏开发godotui交互游戏引擎microsoft性能优化
    用户界面性能优化在开发动作游戏时，用户界面（UI）的性能优化是至关重要的。一个流畅的UI不仅能够提升玩家的体验，还能确保游戏在不同设备上运行顺畅。本节将详细介绍如何在Godot引擎中优化UI性能，包括减少渲染负担、优化资源管理和提高响应速度等方面。1.减少渲染负担1.1使用精灵图（SpriteSheets）精灵图（SpriteSheets）是一种将多个小图合并成一张大图的技术，可以显著减少纹理切换
  • 网页制作12-html,css,javascript初认识のJavascipt脚本基础 Ama_tor 网页制作专栏javascript开发语言ecmascript
    一、JavaScript的三种基本使用方法:body|head|外部网页效果：运行代码：.html无标题文档functionn1(){document.getElementById("ama01").innerHTML="NO.3这是head中的JavaScript函数";}document.write("NO.1HELLOWORLD")//Document要小写NO.2这是body中的JavaS
  • 【Godot】Window类 Octopus2077 godot游戏引擎
    （参考自deepseek回答）在Godot引擎中，Window是一个用于管理应用程序窗口的类。它是Godot4.0引入的新特性，取代了旧版本中的OS类对窗口的管理功能。Window提供了对窗口大小、位置、标题、模式等属性的控制，使开发者能够更灵活地管理应用程序的窗口。1.Window的定义Window继承自Viewport，因此它也是一个渲染容器。它代表应用程序的一个窗口，可以包含2D或3D场景。
  • Linux 命令学习记录 hxung 面试学习使用linux学习运维
    Linux命令详解与进阶指南Linux是一种广泛使用的开源操作系统，掌握Linux命令是开发者和系统管理员的必备技能。本文将详细介绍Linux的常用命令，并涵盖一些高级进阶技巧，帮助你更高效地使用Linux。目录基础命令文件与目录操作文本处理系统信息权限管理进阶命令进程管理网络操作磁盘管理Shell脚本高级技巧管道与重定向正则表达式任务调度性能监控案例实战日志分析自动化部署服务器监控基础命令文件与
  • 如何进行OceanBase 运维工具的部署和表性能优化! oceanbase
    随着OceanBase数据库应用的日益深入，数据量不断攀升，单个表中存储数百万乃至数千万条数据的情况变得愈发普遍。因此，部署专门的运维工具、实施针对性的表性能优化策略，以及加强指标监测工作，都变得更为重要。以下为基于我们的使用场景，所采取的一些部署和优化措施分享。一、OCP部署升级1．OCP升级（1）4.2.1BP1升级到4.2.2，本来以为毫无波澜但是下载完毕一键包并完成前期准备工作启动后发现无
  • Python开发合并多个PDF文件 互联网搬砖老肖 AIPython原力计划pythonpdfjava
    前言在我们的工作中，可能有以下场景需要用到合并多个PDF：文档归档：在企业或组织中，常常需要将相关的文档（如合同、报告、发票等）合并为一个PDF文件，以便于归档和管理。报告生成：在学术研究或项目管理中，研究人员或项目经理可能需要将多个研究报告、数据分析或项目进展文档合并为一个完整的报告，以便于分享和展示。电子书制作：作者或出版商在制作电子书时，可能需要将多个章节或部分合并为一个PDF文件，以便于读
  • C# 通过chrome插件将HTML网页转换为PDF Eiceblue C#.NETPDFc#chromehtml
    将HTML网页内容转换为PDF格式能方便文档的后续打印、存档和分享等。之前介绍过如何通过QT插件将HTML转为PDF文件，本文将介绍另一个新的转换方法，通过谷歌浏览器Chrome插件将HTML网页转PDF文件。首先需要安装Spire.PDFfor.NET库（10.7.21版本及以上）。可以通过此链接下载产品包后手动添加引用，或者直接通过NuGet安装。https://www.e-iceblue.c
  • 数据结构与算法-图（绪论 图论基本概念） 可爱的野指针 数据结构图论算法数据结构有向图欧拉回路
    昨天我的的树就分享完了，树的概念很多吧，二叉树，满二叉树，完全二叉树，赫夫曼树，孩子，双亲……多不？哈哈哈，这算不了什么，我们接下来要看到的图的概念才叫多，没关系，勤奋和时间会让你记住他们，内心只需要告诉自己，加油，我能行，就一定能学会图。不知道有没有看过或者学过离散数学，如果学过，那么恭喜啦，离散数学里的图论就是这一章的基础，图论学的还不错的话，压力就小了。先介绍的是图的定义，图-V个顶点和E条
  • 算法篇——二分查找 古月方源1.0版 算法算法
    二分查找：从理论到实践前言今天无聊，决定在CSDN上发布我的第一篇文章，与大家分享一下二分查找算法。二分查找是一种高效的在有序数组中查找特定元素的算法，其核心思想是通过反复将查找范围减半来快速定位目标元素。二分查找的基本原理二分查找的基本思想非常简单。每次查找时，将数组的中间元素与目标值进行比较：如果中间元素等于目标值，则查找成功。如果中间元素小于目标值，则目标值只可能在右半部分，查找范围缩小为右
  • 基于python+mysql+vue的医院门诊管理系统 自不量力的A同学 mysql
    主要使用技术环境需要1.运行环境：python3.82.IDE环境：pycharm+mysql5.73.数据库工具：Navicat154.硬件环境：windows10/118G内存以上；或者MacOS；5.数据库：MySql5.7版本；技术栈后端：python+django前端：vue+CSS+JavaScript+jQuery+antdesign代码结构server目录是后端代码web目录是前端
  • Next：mui:client.ts:59 The pseudo class “:nth-child“ is potentially unsafe when doing server-side ren dingcho 前端前端reactmui
    client.ts:59Thepseudoclass":nth-child"ispotentiallyunsafewhendoingserver-siderendering.Trychangingitto":nth-of-type"这个警告是因为在服务器端渲染（SSR）中使用:nth-child伪类可能会导致一些问题，因为服务器和客户端的渲染顺序可能不同，从而导致样式不一致。建议将:nth-chi
  • QML界面卡死分析--01 --Canvas与QRasterPaintEngine 香油哥 Qmlqt
    QML界面卡死分析--01现象—Canvas与QRasterPaintEngine相关前置条件：渲染循环使用多线程方式；发现界面假死，无响应;拷贝dump分析，主线程堆栈如下：#0SyncSemWait()#10x000000007b4f8784inQMutexPrivate::wait(int)()fromqt_engine/qt-engine/lib/libQt6Core.so.6.5.0#2
  • vue2和vue3的diff算法有什么区别？ 浮生无聊 vue.jsjavascript前端面试
    1、diff算法是什么？diff算法是一种通过同层的树节点进行比较的高效算法。其有两个特点：只会在同层进行比较，不会跨层比较在diff比较过程中，循环从两边向中间比较diff算法在很多场景下都有应用，在vue中，作用于虚拟dom渲染成真实dom的新旧虚拟节点比较。diff整体策略为：深度优先，同层比较。Vue2和Vue3中的diff算法的主要区别：1、vue2的diff算法vue2使用了经典的di
  • Java 大视界 -- Java 大数据在智慧交通自动驾驶仿真与测试数据处理中的应用（136） 青云交 大数据新视界Java大视界java大数据自动驾驶智慧交通仿真测试数据处理数据存储
    亲爱的朋友们，热烈欢迎来到青云交的博客！能与诸位在此相逢，我倍感荣幸。在这飞速更迭的时代，我们都渴望一方心灵净土，而我的博客正是这样温暖的所在。这里为你呈上趣味与实用兼具的知识，也期待你毫无保留地分享独特见解，愿我们于此携手成长，共赴新程！一、欢迎加入【福利社群】点击快速加入：青云交灵犀技韵交响盛汇福利社群点击快速加入2：2024CSDN博客之星创作交流营（NEW)二、本博客的精华专栏：大数据新视
  • “震惊！这个小小改变，竟让无数人生活大不同！你绝对想不到！” 山峰999 人工智能计算机视觉
    在这个快节奏的时代，每一天都有无数的信息冲击着我们的眼球，但真正能让我们眼前一亮、心头一动的却寥寥无几。今天，我要揭秘的，正是一个看似微不足道，实则威力无穷的“生活小妙招”。它不仅在网络上引起了轩然大波，更让无数实践者惊叹：“原来，幸福和便捷，真的可以如此触手可及！”你准备好迎接这份惊喜，让自己的生活也来个大变身了吗？那就继续往下读，保证让你大开眼界！在数字时代，照片已成为我们记录生活、分享美好瞬
  • 一键解锁压缩烦恼！高效安全免费解压缩神器全面深度剖析 山峰999 安全编辑器microsoft算法大数据推荐算法
    ❤亲爱的小伙伴们，我不定期分享好玩有趣的软件！部分小伙伴有这个需求，为了不错过我们的每一次分享，请大家记得回复互动留言，及时联系就能找到你需要的宝贝，这样大家每天都可以接收和享受到好玩有趣的推送了！❤❤❤你无需担心试用过期或反复提示购买的问题，解压缩神器国际版本承诺永久免费，让你可以无负担地享受压缩服务。在数据压缩与解压领域，一款高效、安全且易用的工具无疑是每位用户的首选。解压缩神器，作为一款的免
  • 8、基于osg引擎实现读取vtk数据通过着色器实现简单体渲染(2) 不收藏找不到我 着色器着色器c++开发语言
    #include#include#include#include#include#include#include#include#include#include#include#include#include#include#include#include#include#include#include#include#includeconststd::stringDATA_PATH=R"(..\
  • COMP 315: Cloud Computing 后端
    Assignment1:JavascriptCOMP315:CloudComputingforE-CommerceFebruary20251IntroductionAcommontaskwhenbackendprogrammingisdatacleaning,whichistheprocessoftakinganinitialdatasetthatmaycontainerroneousorinco
  • scala的option和some 矮蛋蛋 编程scala
    原文地址： http://blog.sina.com.cn/s/blog_68af3f090100qkt8.html 对于学习 Scala 的 Java™ 开发人员来说，对象是一个比较自然、简单的入口点。在 本系列 前几期文章中，我介绍了 Scala 中一些面向对象的编程方法，这些方法实际上与 Java 编程的区别不是很大。我还向您展示了 Scala 如何重新应用传统的面向对象概念，找到其缺点
  • NullPointerException Cb123456 androidBaseAdapter
        java.lang.NullPointerException: Attempt to invoke virtual method 'int android.view.View.getImportantForAccessibility()' on a null object reference     出现以上异常.然后就在baidu上
  • PHP使用文件和目录 天子之骄 php文件和目录读取和写入php验证文件php锁定文件
    PHP使用文件和目录 1.使用include()包含文件 (1)：使用include()从一个被包含文档返回一个值 (2)：在控制结构中使用include()   include_once()函数需要一个包含文件的路径，此外，第一次调用它的情况和include()一样，如果在脚本执行中再次对同一个文件调用，那么这个文件不会再次包含。   在php.ini文件中设置
  • SQL SELECT DISTINCT 语句 何必如此 sql
    SELECT DISTINCT 语句用于返回唯一不同的值。 SQL SELECT DISTINCT 语句 在表中，一个列可能会包含多个重复值，有时您也许希望仅仅列出不同（distinct）的值。 DISTINCT 关键词用于返回唯一不同的值。 SQL SELECT DISTINCT 语法 SELECT DISTINCT column_name,column_name F
  • java冒泡排序 3213213333332132 java冒泡排序
    package com.algorithm; /** * @Description 冒泡 * @author FuJianyong * 2015-1-22上午09:58:39 */ public class MaoPao { public static void main(String[] args) { int[] mao = {17,50,26,18,9,10
  • struts2.18 +json,struts2-json-plugin-2.1.8.1.jar配置及问题！ 7454103 DAOspringAjaxjsonqq
    struts2.18  出来有段时间了！ （貌似是 稳定版）   闲时研究下下！  貌似 sruts2 搭配 json 做 ajax 很吃香！   实践了下下！ 不当之处请绕过！ 呵呵   网上一大堆 struts2+json  不过大多的json 插件 都是 jsonplugin.34.jar   strut
  • struts2 数据标签说明 darkranger jspbeanstrutsservletScheme
    数据标签主要用于提供各种数据访问相关的功能，包括显示一个Action里的属性，以及生成国际化输出等功能 数据标签主要包括： action ：该标签用于在JSP页面中直接调用一个Action，通过指定executeResult参数，还可将该Action的处理结果包含到本页面来。 bean ：该标签用于创建一个javabean实例。如果指定了id属性，则可以将创建的javabean实例放入Sta
  • 链表.简单的链表节点构建 aijuans 编程技巧
    /*编程环境WIN-TC*/ #include "stdio.h" #include "conio.h" #define NODE(name, key_word, help) \  Node name[1]={{NULL, NULL, NULL, key_word, help}} typedef struct node {  &nbs
  • tomcat下jndi的三种配置方式 avords tomcat
    jndi(Java Naming and Directory Interface，Java命名和目录接口)是一组在Java应用中访问命名和目录服务的API。命名服务将名称和对象联系起来，使得我们可以用名称 访问对象。目录服务是一种命名服务，在这种服务里，对象不但有名称，还有属性。          tomcat配置
  • 关于敏捷的一些想法 houxinyou 敏捷
    从网上看到这样一句话：“敏捷开发的最重要目标就是：满足用户多变的需求，说白了就是最大程度的让客户满意。” 感觉表达的不太清楚。 感觉容易被人误解的地方主要在“用户多变的需求”上。 第一种多变，实际上就是没有从根本上了解了用户的需求。用户的需求实际是稳定的，只是比较多，也比较混乱，用户一般只能了解自己的那一小部分，所以没有用户能清楚的表达出整体需求。而由于各种条件的，用户表达自己那一部分时也有
  • 富养还是穷养，决定孩子的一生 bijian1013 教育人生
    是什么决定孩子未来物质能否丰盛？为什么说寒门很难出贵子，三代才能出贵族？真的是父母必须有钱，才能大概率保证孩子未来富有吗？-----作者：@李雪爱与自由 事实并非由物质决定，而是由心灵决定。一朋友富有而且修养气质很好，兄弟姐妹也都如此。她的童年时代，物质上大家都很贫乏，但妈妈总是保持生活中的美感，时不时给孩子们带回一些美好小玩意，从来不对孩子传递生活艰辛、金钱来之不易、要懂得珍惜
  • oracle 日期时间格式转化 征客丶 oracle
    oracle 系统时间有 SYSDATE 与 SYSTIMESTAMP； SYSDATE：不支持毫秒，取的是系统时间； SYSTIMESTAMP：支持毫秒，日期，时间是给时区转换的，秒和毫秒是取的系统的。 日期转字符窜： 一、不取毫秒： TO_CHAR(SYSDATE, 'YYYY-MM-DD HH24:MI:SS') 简要说明， YYYY 年 MM   月
  • 【Scala六】分析Spark源代码总结的Scala语法四 bit1129 scala
    1. apply语法   FileShuffleBlockManager中定义的类ShuffleFileGroup，定义：   private class ShuffleFileGroup(val shuffleId: Int, val fileId: Int, val files: Array[File]) { ... def apply(bucketId
  • Erlang中有意思的bug bookjovi erlang
      代码中常有一些很搞笑的bug，如下面的一行代码被调用两次（Erlang beam） commit f667e4a47b07b07ed035073b94d699ff5fe0ba9b Author: Jovi Zhang <[email protected]> Date: Fri Dec 2 16:19:22 2011 +0100 erts:
  • 移位打印10进制数转16进制-2008-08-18 ljy325 java基础
    /** * Description 移位打印10进制的16进制形式 * Creation Date 15-08-2008 9:00 * @author 卢俊宇 * @version 1.0 * */ public class PrintHex { // 备选字符 static final char di
  • 读《研磨设计模式》-代码笔记-组合模式 bylijinnan java设计模式
    声明： 本文只为方便我个人查阅和理解，详细的分析以及源代码请移步 原作者的博客http://chjavach.iteye.com/ import java.util.ArrayList; import java.util.List; abstract class Component { public abstract void printStruct(Str
  • 利用cmd命令将.class文件打包成jar chenyu19891124 cmdjar
    cmd命令打jar是如下实现： 在运行里输入cmd，利用cmd命令进入到本地的工作盘符。(如我的是D盘下的文件有此路径 D:\workspace\prpall\WEB-INF\classes) 现在是想把D:\workspace\prpall\WEB-INF\classes路径下所有的文件打包成prpall.jar。然后继续如下操作： cd D: 回车 cd workspace/prpal
  • [原创]JWFD v0.96 工作流系统二次开发包 for Eclipse 简要说明 comsci eclipse设计模式算法工作swing
                           JWFD v0.96 工作流系统二次开发包 for Eclipse 简要说明     &nb
  • SecureCRT右键粘贴的设置 daizj secureCRT右键粘贴
    一般都习惯鼠标右键自动粘贴的功能，对于SecureCRT6.7.5 ，这个功能也已经是默认配置了。 老版本的SecureCRT其实也有这个功能，只是不是默认设置，很多人不知道罢了。 菜单： Options->Global Options ...->Terminal 右边有个Mouse的选项块。 Copy on Select Paste on Right/Middle
  • Linux 软链接和硬链接 dongwei_6688 linux
    1.Linux链接概念Linux链接分两种，一种被称为硬链接（Hard Link），另一种被称为符号链接（Symbolic Link）。默认情况下，ln命令产生硬链接。 【硬连接】硬连接指通过索引节点来进行连接。在Linux的文件系统中，保存在磁盘分区中的文件不管是什么类型都给它分配一个编号，称为索引节点号(Inode Index)。在Linux中，多个文件名指向同一索引节点是存在的。一般这种连
  • DIV底部自适应 dcj3sjt126com JavaScript
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml&q
  • Centos6.5使用yum安装mysql——快速上手必备 dcj3sjt126com mysql
    第1步、yum安装mysql [root@stonex ~]#  yum -y install mysql-server 安装结果： Installed:     mysql-server.x86_64 0:5.1.73-3.el6_5                   &nb
  • 如何调试JDK源码 frank1234 jdk
    相信各位小伙伴们跟我一样，想通过JDK源码来学习Java，比如collections包，java.util.concurrent包。 可惜的是sun提供的jdk并不能查看运行中的局部变量，需要重新编译一下rt.jar。 下面是编译jdk的具体步骤：         1.把C:\java\jdk1.6.0_26\sr
  • Maximal Rectangle hcx2013 max
    Given a 2D binary matrix filled with 0's and 1's, find the largest rectangle containing all ones and return its area.   public class Solution { public int maximalRectangle(char[][] matrix)
  • Spring MVC测试框架详解——服务端测试 jinnianshilongnian spring mvc test
    随着RESTful Web Service的流行，测试对外的Service是否满足期望也变的必要的。从Spring 3.2开始Spring了Spring Web测试框架，如果版本低于3.2，请使用spring-test-mvc项目（合并到spring3.2中了）。   Spring MVC测试框架提供了对服务器端和客户端（基于RestTemplate的客户端）提供了支持。 &nbs
  • Linux64位操作系统（CentOS6.6）上如何编译hadoop2.4.0 liyong0802 hadoop
    一、准备编译软件   1.在官网下载jdk1.7、maven3.2.1、ant1.9.4，解压设置好环境变量就可以用。     环境变量设置如下：   （1）执行vim /etc/profile （2）在文件尾部加入: export JAVA_HOME=/home/spark/jdk1.7 export MAVEN_HOME=/ho
  • StatusBar 字体白色 pangyulei status
    [[UIApplication sharedApplication] setStatusBarStyle:UIStatusBarStyleLightContent]; /*you'll also need to set UIViewControllerBasedStatusBarAppearance to NO in the plist file if you use this method
  • 如何分析Java虚拟机死锁 sesame javathreadoracle虚拟机jdbc
    英文资料： Thread Dump and Concurrency Locks   Thread dumps are very useful for diagnosing synchronization related problems such as deadlocks on object monitors. Ctrl-\ on Solaris/Linux or Ctrl-B
  • 位运算简介及实用技巧（一）：基础篇 tw_wangzhengquan 位运算
    http://www.matrix67.com/blog/archives/263    去年年底写的关于位运算的日志是这个Blog里少数大受欢迎的文章之一，很多人都希望我能不断完善那篇文章。后来我看到了不少其它的资料，学习到了更多关于位运算的知识，有了重新整理位运算技巧的想法。从今天起我就开始写这一系列位运算讲解文章，与其说是原来那篇文章的follow-up，不如说是一个r
  • jsearch的索引文件结构 yangshangchuan 搜索引擎jsearch全文检索信息检索word分词
    jsearch是一个高性能的全文检索工具包，基于倒排索引，基于java8，类似于lucene，但更轻量级。   jsearch的索引文件结构定义如下：     1、一个词的索引由=分割的三部分组成：        第一部分是词        第二部分是这个词在多少