你不知道的 Web 性能优化 | 原力计划-重拳出击
你不知道的 Web 性能优化 | 原力计划-重拳出击
你遇到过打开一个网站需要10秒以上的吗?这种网页响应非常缓慢,占用大量的CPU和内存,浏览起来常常有卡顿,页面的动画效果也不流畅。你会有什么反应?我猜想,大多数用户会关闭这个页面,改为访问其他网站。作为一个开发者,肯定不愿意看到这种情况,那么怎样才能提高性能呢?
有兴趣的同学可以去我的GitHub,里面有我的分享的学习过程和blog:github.com/193Eric。
使用Web Worker
Web Worker 是HTML5 提供的一个Javascript多线程解决方案,运行在浏览器后台。如我们所知js是个单线程的,js引擎在运行js的时候,不能干其他事。不过在使用中需要注意以下几点:
它是一种JavaScript 工作线程,不能直接访问DOM
能发送网络请求。
它在不用时会被中止,并在下次有需要时重启
在开发过程中,可以通过 localhost 使用服务工作线程,但如果要在网站上部署服务工作线程,需要在服务器上设置 HTTPS。
Worker 线程无法读取本地文件,即不能打开本机的文件系统(file://),它所加载的脚本,必须来自网络,这样做主要是为了安全,因为是可以通讯的,如果被别人修改了文件,引入了本地的js,进行通讯就会出现问题,所以只能访问同源的网络文件。(重点,所以本地调试的时候需要开启服务,用node或者后台语言启动 )
web Worker 与主线程的交互速度
我们用代码来看下从主线程 --> web worker --> 主线程 最简单的需要多长时间。
webWorker
var worker = new Worker("worker.js");
console.log(new Date().getTime()) // 开始时间
worker.postMessage("123456")
worker.onmessage = function (e) {
console.log(new Date().getTime()) // 接收时间
}
//webWorker.js
onmessage=function(evt){
vard=evt.data//通过evt.data获得发送来的数据
postMessage(d)//将获取到的数据发送会主线程
}
经过几次测试,大概的事件在30-50ms之间(当然这个值会随着机器性能问题有大有小),正常的传输速度是很快的。
web Worker 优化策略与实践
案例:大量的js计算(fibonacci数列计算)
varworker=newWorker("worker.js");
letbeginTime=newDate().getTime()
console.log(beginTime)
letfibonacci=(n)=>{
returnn<2?n:fibonacci(n-1)+fibonacci(n-2);
};
fibonacci(45)
letendTime=newDate().getTime()
console.log(`${endTime}---------历时${(endTime-beginTime)/1000}s`)
我们在主线程计算fibonacci(45)看看需要多少时间,在计算的时候页面是卡主的,会非常影响用户体验。
然后我们看看放在web worker里面是什么情况。
//index.htmlvarworker=newWorker("worker.js");letbeginTime=newDate().getTime()console.log(beginTime)worker.postMessage("fibonacci");worker.onmessage=function(e){letendTime=newDate().getTime()console.log(e,`${endTime}---------历时${(endTime-beginTime)/1000}s`)};console.log("working")console.log("working")console.log("working")
//worker.jsonmessage=function(evt){vard=evt.data;//通过evt.data获得发送来的数据letfibonacci=(n)=>{returnn<2?n:fibonacci(n-1)+fibonacci(n-2);};letdata=fibonacci(45)postMessage(data);//将获取到的数据发送会主线程}
可以看到,计算的时间是差不多的,但是并没有阻碍页面的运行。所以,一些高计算耗费时间的功能,可以放到web worker中计算完成后再返回回来。
SPA项目首页白屏问题
现在三大框架(vue,react,angular)的兴起,越来越多的项目采用SPA这种接近原生app体验的架构方式。采用SPA模式,就意味着,首页或者main.js过大,首屏加载的速度会受到很大的限制。会存在一定时间的白屏。
SPA项目因为html都是js去生成的(虚拟Dom原理),所以在js没有执行加载完之前,dom是不会有的。一开始客户端从服务端获取到html只是一个空壳,所以会显示白屏。
下面列出一些解决方案:
1.服务端渲染SSR(加快首屏加载和SEO)
SSR是一个可以有效的提高首屏渲染速度的方法,之后我会开单张去单独实践服务端渲染。
2.预渲染
预渲染是一个方案,使用爬虫技术。由于我们打包过后的都是一些js文件,使用一些技术(puppeteer)可以爬取到项目在chrome浏览器展示的页面,然后把它写入js,和打包文件一起。类似prerender-spa-plugin
不过这种技术的缺点也很明显,我们在打包过程中,所展示的页面是当时环境下的数据,也就是说如果首页有很多的动态获取的数据(比如说实时的股票价格),那如果采用这种方案,用户第一眼看到并不是当时数据,会认为是个错误信息。
3.骨架屏(占位块和图片)
骨架屏可以说现在比较实用的首屏优化技术了,方便也不是很复杂。骨架屏类似于app的启动页,一般我们进入app都会有宣传的启动页,然后才看到首页。骨架屏就是这样,用户进来首先看到的是骨架屏,然后首页渲染完之后,再把骨架屏干掉。
骨架屏主要有两种方式可以完成:
通过编译的时候自动生成还是puppeteer(上面说了预渲染也用,它主要是能在代码里面唤起chrome浏览器,或者后台唤起,也就是没有弹出浏览器,但是可以获取到真实浏览器中渲染的内容),有了它我们就能获取到浏览器里面的dom元素,然后通过对页面中元素进行删减或增添,对已有元素进行修改生成我们想要的骨架,然后将修改后的 HTML 和 CSS 样式提取出来,这样就是骨架屏了。当然遇到了图片的话,还是需要转成svg的形式,或者base64这样就不需要网络请求了。
通过设计图+布局这是一种直接重新写一个页面的方式,图片的话采用svg和base64的形式,生成一个dom,解析注入到服务器返回的index.html里面(ssr render注入)。
现在网络上的项目,最能提现的就是饿了么的h5了,我们可以通过手机浏览器打开饿了么。
我们首先看到是骨架屏,然后过一会才会看到首屏,这就是饿了么用了这种技术,很大的提高了用户的体验。page-skeleton-webpack-plugin项目地址:https://github.com/ElemeFE/page-skeleton-webpack-plugin
SSL延迟有多大?
我们知道http是经过TCP三次握手就可以成功通讯 。再来看Https链接,它也采用TCP协议发送数据,所以它也需要上面的这三步握手过程。而且,在这三步结束以后,它还有一个SSL握手。
HTTP耗时 = TCP握手 ; HTTPS耗时 = TCP握手 + SSL握手
在研究ssl延迟之前,我们先来学一个命令行工具curl,-w,–write-out参数。顾名思义,write-out的作用就是输出点什么。curl的-w参数用于在一次完整且成功的操作后输出指定格式的内容到标准输出。
主要了解下几个参数:
http_code http状态码
time_total 总时间,按秒计。
time_namelookup DNS解析时间,从请求开始到DNS解析完毕所用时间
time_connect 连接时间,从开始到建立TCP连接完成所用时间,
time_appconnect 连接建立完成时间,如SSL/SSH等建立连接或者完成三次握手时间。
我们主要用time_connect(TCP握手的耗时),time_appconnect(SSL握手的耗时)
终端输入curl -w "TCP握手的耗时: %{time_connect}, SSL握手的耗时: %{time_appconnect}\n" -so /dev/null https://www.taobao.com
我们可以看到ssl耗时是tcp的三倍左右,具体数字取决于CPU的快慢和网络状况。
所以,如果是对安全性要求不高的场合,为了提高网页性能,建议不要采用保密强度很高的数字证书。
防抖节流那些事
在开发过程中我们很多时候会碰到需要防抖和节流去解决问题。不要小看它们,没有它们的话,特定情况下的会造成很大的性能阻塞。
防抖(当持续触发事件时,一定时间段内没有再触发事件,事件处理函数才会执行一次)防抖我们可以理解为,存在一个scroll事件,只要滚动就会触发handler回调函数,防抖的处理是,等scroll事件完全停下来1000ms(这个值自行设定)之后,再出触发handler函数。
节流(当持续触发事件时,保证一定时间段内只调用一次事件处理函数)节流顾名思义,触发scroll事件的时候,并不立即执行handle函数,每隔1000ms(这个值自行设定)才会执行一次handle函数
区别:节流是每一个时间段之后就会触发一次,存在间隙的连续触发,而防抖不一样,只会在最后才触发一次。
重排与重绘的相爱相杀
从前面的文章(浏览器渲染过程剖析)已经学到了网页的生成过程。
HTML代码转化成DOM
CSS代码转化成CSSOM(CSS Object Model)
结合DOM和CSSOM,生成一棵渲染树(包含每个节点的视觉信息)
生成布局(layout),即将所有渲染树的所有节点进行平面合成
将布局绘制(paint)在屏幕上
1-3步都很快,耗时的是第四步和第五步。这两步合称”渲染“,在网上生成的过程中,网页至少会渲染一次。
有三种情况会导致浏览器重新渲染:
1.修改DOM
2.修改样式表
3.用户事件(比如鼠标悬停、页面滚动、输入框键入文字、改变窗口大小等等)
重新渲染,就需要重新生成布局和重新绘制。前者叫做"重排"(reflow),后者叫做"重绘"(repaint)。
重排和重绘不断的触发,是影响网页性能低下的根本原因。提高网页性能,就是要降低"重排"和"重绘"的频率和成本,尽量少触发重新渲染。重排必定会重绘,而重绘不一定重排。
最后
喜欢小编的可以点个赞关注小编哦,小编每天都会给大家分享文章。
我自己是一名从事了多年的前端老程序员,小编为大家准备了新出的前端编程学习资料,免费分享给大家!
如果你也想学习前端,加入此Q群:950919261
你可能感兴趣的:(你不知道的 Web 性能优化 | 原力计划-重拳出击)
网络安全测评技术与标准
坚持可信
信息安全 web安全 网络 安全
网络安全测评是评估信息系统、网络和应用程序的安全性,以发现潜在的漏洞和威胁,并确保系统符合安全标准和政策的过程。以下是常见的网络安全测评类型:1.渗透测试(PenetrationTesting)描述:通过模拟真实的攻击,评估系统、网络和应用程序的安全性,识别和修复漏洞。目标:发现系统中的安全漏洞,评估其可能被利用的风险。方法:黑盒测试:测试人员没有系统内部信息,模拟外部攻击者。白盒测试:测试人员拥
惭愧
熊僈伶
一直以来,我只忙着给学生上课,没有更多顾及自己的孩子,要么给他丢家里长时间的看电视,要么把他扔在学校不管,昨天一个男同事打电话跟我说,叫我多管管自己的儿子,当时我真的感觉到羞愧难当!这次的事情也是与我的疏忽有关的,我要是第二节晚自习下去找找他,要求他坐休息室就好了,给他手机让他先看着电视,也不至于被那个男生推了摔倒摔到头,真真的叫我肠子都悔青了!很多孩子发生意外,都是当爸爸妈妈的疏忽所导致的!我对
如何通过学习经典,写出一篇优质的情感爆款文【续集】
小夭读书
昨天文章中说到的都是如何通过阅读经典后,再对比自我写作中总结出的盲点,今天就要详细说说爆款文的干货内容了。首先是爆款文的选题:如果你大量去阅读一些类似的文章,你就会发现所有的文章都有套路,只要你能用心去归类总结,就一定能找到你想要写的主题。
C# Linq语句用法大全以及Lambda表达式
一个小码码
c# linq 开发语言 .net
C#Linq语句用法大全以及Lambda表达式Linq:是一种用于数据查询和操作的语言集成查询(LanguageIntegratedQuery)技术。通过Linq,我们可以使用类似于SQL查询的方式来查询、筛选和操作各种类型的数据集合,包括数组、列表、集合、XML文档、数据库表等等。常见的有:LinqtoObjects:用于操作对象集合,例如数组、列表等。LinqtoXML:用于操作XML数据,支
公司的资产有哪些?
流年践行
说起资产,你会不会想到:货币资金、预付款项、存货、流动资产、固定资产、无形资产等等,这些在资产负债表中经常出现的财务概念?今天我们不是来讨论资产的明细科目,而是讲一下关于怎么看待资产和资产的一些重要认知。如何看待企业的资产呢?只有在未来能够产生收益的经济资源,才是资产。企业所拥有的资产,远远大于财务报表中所记录的资产。比如:假如一家蛋糕店接了一个特殊订单,为此买了一批特殊形状的模具,蛋糕做完之后,
22023-03-25将摆烂坚持到底
江小米米
是的,今天又摆烂了,啥啥都没干!誓将摆烂坚持到底的节奏!一周内瑜伽,没回春,每天一抄经就想睡觉…哎,明天的搏击也想请假,这样真的好吗?幸好这周还算忙过两天,也把家具给搞定了,明天下午要不就请假吧,免得4点后太赶?继续纠结吧!
Protobuf3语言指南
R-QWERT
数据结构化与序列化 protobuf
定义一个消息类型指定字段类型分配标识号指定字段规则添加更多消息类型添加注释保留标识符(Reserved)从.proto文件生成了什么?标量数值类型默认值枚举使用其他消息类型导入定义使用proto2消息类型嵌套类型更新一个消息类型AnyOneof使用OneofOneof特性向后兼容性问题映射(Maps)向后兼容性问题包(Packages)包及名称的解析定义服务JSON映射选项自定义选项生成你的类英文
Java中的大数据处理框架对比分析
省赚客app开发者
java 开发语言
Java中的大数据处理框架对比分析大家好,我是微赚淘客系统3.0的小编,是个冬天不穿秋裤,天冷也要风度的程序猿!今天,我们将深入探讨Java中常用的大数据处理框架,并对它们进行对比分析。大数据处理框架是现代数据驱动应用的核心,它们帮助企业处理和分析海量数据,以提取有价值的信息。本文将重点介绍ApacheHadoop、ApacheSpark、ApacheFlink和ApacheStorm这四种流行的
零时空间005*99天圆满/似此星辰同昨日~随笔
似此星辰同昨日
文l仙派狼王*星辰原创时间过得真快,一晃三个月就过去了。最没想到的是,我这么懒的人,到现在,居然把自己以前写的,那些杂七杂八的东西,整理得差不多了。写不是问题,好赖能够写出来,一说到改,头疼得厉害。再一个就是舍弃,但不是丢弃,怎么说都是我自己的作品。留着有空的时候看看,或许还能找到灵感呢!不知道别人怎么想的,对于写小文,我不是特别喜欢写,总觉得和考试的文章一样,写起来总是感觉不那么舒畅。我翻看以前
mariadb主从配置步骤
秋月霜风
其他知识标记 mariadb android adb
mariadb主从配置步骤配置开始前注意关闭主从服务器的防火墙或者确保主从服务器之间数据库通信正常;主服务器(主IP)配置a.编辑主服务器的MariaDB配置文件:sudovim/etc/my.cnf.d/mariadb-server.cnfb.在[mysqld]部分添加或修改以下内容:[mysqld]server-id=1log-bin=/var/log/mariadb/mysql-binbin
【2020周总结】44/52周
记录我的生活
10月第4周:2020年10月19日——2020年10月25日健康1.调整饮食第三个月:目标体重104斤,当下体重109斤。2.乳腺增生,买药一周内只有两天按时吃药,想不起来吃。3.平均22:30入睡,起床5:30。本周单位午餐2天,带饭三天,外食三次,持续践行光盘,比以前能吃饭了。日均走路6000步,骑行次,骑累计超过175/200公里。三十多块钱,换来三个月的健康和多次早上以及其他时间的节省,
我的高中时代
枉江三年
图片发自App图片发自App图片发自App图片发自App图片发自App图片发自App图片发自App图片发自App图片发自App图片发自App图片发自App图片发自App图片发自App图片发自App图片发自App图片发自App图片发自App图片发自App图片发自App图片发自App2016--2017我的兵荒马乱的高中时代无人像你让我眼泪倒着流仅此纪念
Ubuntu系统入门指南:常用命令详解
像风一样自由2020
ubuntu ubuntu linux 运维
Ubuntu系统入门指南:常用命令详解引言Ubuntu是一个基于Linux内核的开源操作系统,由Canonical公司和社区共同开发和维护。它以易用性、稳定性和广泛的软件支持而著称,广泛应用于个人电脑、服务器和云计算环境。对于新手来说,掌握Ubuntu的基本命令行操作可以大大提高工作效率和系统管理能力。Ubuntu通常每六个月发布一个新版本,每两年会推出一个长期支持(LTS)版本,提供五年的安全更
python 打包 太大 精简_pyinstaller打包结果瘦身
TIME
python 打包 太大 精简
如果想把python程序发布成.exe的话,一般我们都会使用pyinstaller,怎么打包这里我就不说了。有时我们打包的结果会非常大,我最大的一次居然有900M......下面我就总结一下可以对发布结果瘦身的方法。注意:下面的方法只对打包成多个文件夹(pyinstaller-D)的情况有效;对打包成一个.exe文件(pyinstaller-F)的情况无效。使用from...import...进行
深入理解Webpack核心模块Tapable钩子[异步版]
weixin_34413802
webpack javascript ViewUI
接上一篇文章深入理解Webpack核心模块WTApable钩子(同步版)tapable中三个注册方法1tap(同步)2tapAsync(cb)3tapPromise(注册的是Promise)tapable中对三个触发方法1call2callAsync3promise这一章节我们将分别实现异步的Async版本和Promise版本异步钩子AsyncParallelHookAsyncParallelHo
CSS截取字符串,多余文字用省略号显示
这真的是一个帅气的名字
line-height:30px;text-align:center;text-overflow:ellipsis;/*让超出的用...实现*/white-space:nowrap;/*禁止换行*/overflow:hidden;/*超出的隐藏*/display:block;多行:border:1pxsolid#ddd;width:200px;word-break:break-all;text-o
Day22 把时间当朋友-001
平小一
之前立了个flag,说要坚持日更100天。素材来源于上班路上听的得到或者看的文章,今天没库存了也不知道写啥,虽然早上一到公司就写了今天要日更的目标。来了之后先东搞西搞的干活,一边想素材,一会儿又签离职,正打算写的时候又被电话打断了。等我真正开始写的时候,离开始准备写的时候已经过去1个半小时了。这种情况是不是很常见?明明打算要干一件事,准备干的时候又被其他的事情不断打断,等真正想起来要干的时候时间已
内心满足
微笑向暖f
内心满足就不会去追求外在的东西今天老公值班我一人在家,早上老公说要把饭做好再去上班,我没让....上午发微信,说起了手机,元旦老公没给我说,自己去给我买了手机,说我跟着他受罪了,什么都不舍得买,手机还是用的之前的小屏手机,而且手机也已经出现了问题。而我真的感觉没什么,用着还不耽误,我还可以继续用,虽然有时候学生还会说我还不换手机,但是我却没有一点想换手机的欲望。而且以前我可能对外在的东西有所追求,
无题
心若繁语
昨夜还算一夜好眠。就是临睡前有了一个小插曲。左耳的耳廓内起了一个小包,又痛又痒。于是左耳的感觉就比平日里稍微敏感一些。侧卧在左边,突然发现左耳的耳轮被压在枕头上,不管是卷着还是平铺都不是很舒服。不仅疑惑自己平时都是怎样的位置入眠的呢?辗转反侧纠结了几圈,突然想起小时候看到过的一个漫画故事。故事的大意是这样的:据说有一位长胡子老爷爷从来未在意过晚上睡觉,自己的胡子是放在被子里面还是外面的。直到有一天
遇到你之前我叫敢敢,遇到你之后我叫憨憨
安琪拉的鞋
遇到你之前,我叫敢敢,遇到你之后,我叫憨憨。先来讲个故事吧:女孩是一个乐于施舍的人,她自己独处在一个房子里。有一天,女孩打开房门,发现门口躺着一条死掉了的鱼,她感觉十分晦气,于是把死掉的鱼装进垃圾袋。可第二天,又有一条死鱼躺在了她门口,女孩皱了皱眉头,还是把鱼扔掉了。第三天,依旧是一样的把戏。图片发自App为了抓住那个恶作剧的人,女孩选择下一次早上在不远处的楼梯口等待着。她一大早起来,在楼梯口看着
Oozie Bundle 规范
weixin_34075268
为什么80%的码农都做不了架构师?>>>文档地址转载于:https://my.oschina.net/sskxyz/blog/756359
每天早起,改变自己
ly淣
经历一夜的早睡休整,早上早起一小时的时光,是我觉得精力最充沛,最活跃的时间段。早上起来,最喜欢观看天色,这时的天空很静谧,月亮还在天空明亮的照着,仿佛一弯安静的小船在诉说着故乡的温情!有的人喜欢早晨起来翻翻书,看看报,或是晨练,也有喜欢喝杯咖啡的。而我喜欢朗读,专注了半小时,读了一章《时间的答案》,它也慢慢融入了我的思想,读书需要坚持,和耐性,好好读书吧~仅仅有条的做着自己喜欢的事情,从朗读,到做
正月(四)小海
季孟秋
小海是我大学师弟。当初怎么认识他的,我已经没了印象,但我很快听说他在中学就没了爹,生活挺困难。那会儿我在学生会里花差花差,手里有几个勤工俭学的名额,于是一半假公济私,一半顺水人情,就推荐给了他。然后他挣到第一笔钱,请我大吃了一顿。这顿饭,他竟然请我吃了昂贵的牛排。有钱就花,是他那强烈的性格特征之一。到了他大学毕业之后,他花钱的模式升级到了一个让人无法理解的高度。例如,他在几年前结婚前竟然一口气贷款
webpack 之 tapable 学习
weixin_34008784
webpack javascript ViewUI
前言webpack大家应该都耳熟能详了。个人感觉,webpack的本质就是让一堆的Loader和Plugin在webpack的可支配范围内,有序可控的执行,最终生成一堆可在浏览器中执行的code和一些状态信息。而这些Loader和Plugin,有用户自定义的,也有webpack自己内部定义的。Loader的运行机制,不是这篇文章讲述的内容,有需要的朋友,可以看下我之前的这篇文章:webpack之l
K8S学习之PV&&PVC
david161
部署mysql之前我们需要先了解一个概念有状态服务。这是一种特殊的服务,简单的归纳下就是会产生需要持久化的数据,并且有很强的I/O需求,且重启需要依赖上次存储到磁盘的数据。如典型的mysql,kafka,zookeeper等等。在我们有比较优秀的商业存储的前提下,非常推荐使用有状态服务进行部署,计算和存储分离那是相当的爽的。在实际生产中如果没有这种存储,localPV也是不错的选择,当然local
webapck由浅入深——(Tapable)
weixin_33737134
webpack ViewUI
webpack系列文章webpack由浅入深——(webpack基础配置)webpack由浅入深——(webpack优化配置)webpack由浅入深——(tapable)webpack由浅入深——(webapck简易版)webpack由浅入深——(ast、loader和plugin)Tapable和webpackTapable是基于发布订阅模式实现的一个类库,提供了许多Hook类,可创建许多钩子。
mysql 函数索引如何使用_MySQL 函数索引 (Functional indexes)
nothing
mysql 函数索引如何使用
MySQL8.0.13版本开始支持函数索引(Functionalindexes),在此之前,只能使用表的字段或者字段前缀来创建索引,从8.0.13版本开始,可以使用函数或者表达式的值来创建索引,这些函数或者表达式的值并不直接存储在表中。函数索引示例:CREATETABLEt1(col1INT,col2INT,INDEXfunc_index((ABS(col1))));CREATEINDEXidx1
日本游day7-银座
肌肉男宅急便
明天行程就结束了,今天是安排东京自由行。来日本旅游还有一个节目没有进行-扫货,从酒店步行到银座只要20分钟。所以今天的行程就是银座一丁目到八丁目!优衣库旗舰店林立的旗舰店
Protobuf学习 - 入门
weixin_30892987
c/c++ python 数据结构与算法
古之立大事者,不惟有超世之才,亦必有坚忍不拔之志--苏轼·《晁错论》从公司的项目源码中看到了这个东西,觉得挺好用的,写篇博客做下小总结。下面的操作以C++为编程语言,protoc的版本为libprotoc3.2.0。一、Protobuf?1.是什么?GoogleProtocolBuffer(简称Protobuf)是一种轻便高效的结构化数据存储格式,平台无关、语言无关、可扩展,可用于通讯协议和数据存
操作sqlserver 抛出异常 CMemoryException
weixin_30484247
数据库
恭喜一下自己,还在内存中打转;并且短时间出不来了。说打开sqlserver就发现内存一直涨没有停下来的势头,怀疑是sqlserver有内存泄露——其实这是sqlserver的机制,只要内存不大于设定的最大内存,sqlserver就不释放。那么为什么会出现CMemoryException?打开资源管理器,注意到此时sqlserver占1.6G,远程管理占700M,windows自身占1G,本身的数据
mondb入手
木zi_鸣
mongodb
windows 启动mongodb 编写bat文件,
mongod --dbpath D:\software\MongoDBDATA
mongod --help 查询各种配置
配置在mongob
打开批处理,即可启动,27017原生端口,shell操作监控端口 扩展28017,web端操作端口
启动配置文件配置,
数据更灵活 
大型高并发高负载网站的系统架构
bijian1013
高并发 负载均衡
扩展Web应用程序
一.概念
简单的来说,如果一个系统可扩展,那么你可以通过扩展来提供系统的性能。这代表着系统能够容纳更高的负载、更大的数据集,并且系统是可维护的。扩展和语言、某项具体的技术都是无关的。扩展可以分为两种:
1.
DISPLAY变量和xhost(原创)
czmmiao
display
DISPLAY
在Linux/Unix类操作系统上, DISPLAY用来设置将图形显示到何处. 直接登陆图形界面或者登陆命令行界面后使用startx启动图形, DISPLAY环境变量将自动设置为:0:0, 此时可以打开终端, 输出图形程序的名称(比如xclock)来启动程序, 图形将显示在本地窗口上, 在终端上输入printenv查看当前环境变量, 输出结果中有如下内容:DISPLAY=:0.0
获取B/S客户端IP
周凡杨
java 编程 jsp Web 浏览器
最近想写个B/S架构的聊天系统,因为以前做过C/S架构的QQ聊天系统,所以对于Socket通信编程只是一个巩固。对于C/S架构的聊天系统,由于存在客户端Java应用,所以直接在代码中获取客户端的IP,应用的方法为:
String ip = InetAddress.getLocalHost().getHostAddress();
然而对于WEB
浅谈类和对象
朱辉辉33
编程
类是对一类事物的总称,对象是描述一个物体的特征,类是对象的抽象。简单来说,类是抽象的,不占用内存,对象是具体的,
占用存储空间。
类是由属性和方法构成的,基本格式是public class 类名{
//定义属性
private/public 数据类型 属性名;
//定义方法
publ
android activity与viewpager+fragment的生命周期问题
肆无忌惮_
viewpager
有一个Activity里面是ViewPager,ViewPager里面放了两个Fragment。
第一次进入这个Activity。开启了服务,并在onResume方法中绑定服务后,对Service进行了一定的初始化,其中调用了Fragment中的一个属性。
super.onResume();
bindService(intent, conn, BIND_AUTO_CREATE);
base64Encode对图片进行编码
843977358
base64 图片 encoder
/**
* 对图片进行base64encoder编码
*
* @author mrZhang
* @param path
* @return
*/
public static String encodeImage(String path) {
BASE64Encoder encoder = null;
byte[] b = null;
I
Request Header简介
aigo
servlet
当一个客户端(通常是浏览器)向Web服务器发送一个请求是,它要发送一个请求的命令行,一般是GET或POST命令,当发送POST命令时,它还必须向服务器发送一个叫“Content-Length”的请求头(Request Header) 用以指明请求数据的长度,除了Content-Length之外,它还可以向服务器发送其它一些Headers,如:
HttpClient4.3 创建SSL协议的HttpClient对象
alleni123
httpclient 爬虫 ssl
public class HttpClientUtils
{
public static CloseableHttpClient createSSLClientDefault(CookieStore cookies){
SSLContext sslContext=null;
try
{
sslContext=new SSLContextBuilder().l
java取反 -右移-左移-无符号右移的探讨
百合不是茶
位运算符 位移
取反:
在二进制中第一位,1表示符数,0表示正数
byte a = -1;
原码:10000001
反码:11111110
补码:11111111
//异或: 00000000
byte b = -2;
原码:10000010
反码:11111101
补码:11111110
//异或: 00000001
java多线程join的作用与用法
bijian1013
java 多线程
对于JAVA的join,JDK 是这样说的:join public final void join (long millis )throws InterruptedException Waits at most millis milliseconds for this thread to die. A timeout of 0 means t
Java发送http请求(get 与post方法请求)
bijian1013
java spring
PostRequest.java
package com.bijian.study;
import java.io.BufferedReader;
import java.io.DataOutputStream;
import java.io.IOException;
import java.io.InputStreamReader;
import java.net.HttpURL
【Struts2二】struts.xml中package下的action配置项默认值
bit1129
struts.xml
在第一部份,定义了struts.xml文件,如下所示:
<!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.3//EN"
"http://struts.apache.org/dtds/struts
【Kafka十三】Kafka Simple Consumer
bit1129
simple
代码中关于Host和Port是割裂开的,这会导致单机环境下的伪分布式Kafka集群环境下,这个例子没法运行。
实际情况是需要将host和port绑定到一起,
package kafka.examples.lowlevel;
import kafka.api.FetchRequest;
import kafka.api.FetchRequestBuilder;
impo
nodejs学习api
ronin47
nodejs api
NodeJS基础 什么是NodeJS
JS是脚本语言,脚本语言都需要一个解析器才能运行。对于写在HTML页面里的JS,浏览器充当了解析器的角色。而对于需要独立运行的JS,NodeJS就是一个解析器。
每一种解析器都是一个运行环境,不但允许JS定义各种数据结构,进行各种计算,还允许JS使用运行环境提供的内置对象和方法做一些事情。例如运行在浏览器中的JS的用途是操作DOM,浏览器就提供了docum
java-64.寻找第N个丑数
bylijinnan
java
public class UglyNumber {
/**
* 64.查找第N个丑数
具体思路可参考 [url] http://zhedahht.blog.163.com/blog/static/2541117420094245366965/[/url]
*
题目:我们把只包含因子
2、3和5的数称作丑数(Ugly Number)。例如6、8都是丑数,但14
二维数组(矩阵)对角线输出
bylijinnan
二维数组
/**
二维数组 对角线输出 两个方向
例如对于数组:
{ 1, 2, 3, 4 },
{ 5, 6, 7, 8 },
{ 9, 10, 11, 12 },
{ 13, 14, 15, 16 },
slash方向输出:
1
5 2
9 6 3
13 10 7 4
14 11 8
15 12
16
backslash输出:
4
3
[JWFD开源工作流设计]工作流跳跃模式开发关键点(今日更新)
comsci
工作流
既然是做开源软件的,我们的宗旨就是给大家分享设计和代码,那么现在我就用很简单扼要的语言来透露这个跳跃模式的设计原理
大家如果用过JWFD的ARC-自动运行控制器,或者看过代码,应该知道在ARC算法模块中有一个函数叫做SAN(),这个函数就是ARC的核心控制器,要实现跳跃模式,在SAN函数中一定要对LN链表数据结构进行操作,首先写一段代码,把
redis常见使用
cuityang
redis 常见使用
redis 通常被认为是一个数据结构服务器,主要是因为其有着丰富的数据结构 strings、map、 list、sets、 sorted sets
引入jar包 jedis-2.1.0.jar (本文下方提供下载)
package redistest;
import redis.clients.jedis.Jedis;
public class Listtest
配置多个redis
dalan_123
redis
配置多个redis客户端
<?xml version="1.0" encoding="UTF-8"?><beans xmlns="http://www.springframework.org/schema/beans" xmlns:xsi=&quo
attrib命令
dcj3sjt126com
attr
attrib指令用于修改文件的属性.文件的常见属性有:只读.存档.隐藏和系统.
只读属性是指文件只可以做读的操作.不能对文件进行写的操作.就是文件的写保护.
存档属性是用来标记文件改动的.即在上一次备份后文件有所改动.一些备份软件在备份的时候会只去备份带有存档属性的文件.
Yii使用公共函数
dcj3sjt126com
yii
在网站项目中,没必要把公用的函数写成一个工具类,有时候面向过程其实更方便。 在入口文件index.php里添加 require_once('protected/function.php'); 即可对其引用,成为公用的函数集合。 function.php如下:
<?php /** * This is the shortcut to D
linux 系统资源的查看(free、uname、uptime、netstat)
eksliang
netstat linux uname linux uptime linux free
linux 系统资源的查看
转载请出自出处:http://eksliang.iteye.com/blog/2167081
http://eksliang.iteye.com 一、free查看内存的使用情况
语法如下:
free [-b][-k][-m][-g] [-t]
参数含义
-b:直接输入free时,显示的单位是kb我们可以使用b(bytes),m
JAVA的位操作符
greemranqq
位运算 JAVA位移 << >>>
最近几种进制,加上各种位操作符,发现都比较模糊,不能完全掌握,这里就再熟悉熟悉。
1.按位操作符 :
按位操作符是用来操作基本数据类型中的单个bit,即二进制位,会对两个参数执行布尔代数运算,获得结果。
与(&)运算:
1&1 = 1, 1&0 = 0, 0&0 &
Web前段学习网站
ihuning
Web
Web前段学习网站
菜鸟学习:http://www.w3cschool.cc/
JQuery中文网:http://www.jquerycn.cn/
内存溢出:http://outofmemory.cn/#csdn.blog
http://www.icoolxue.com/
http://www.jikexue
强强联合:FluxBB 作者加盟 Flarum
justjavac
r
原文:FluxBB Joins Forces With Flarum作者:Toby Zerner译文:强强联合:FluxBB 作者加盟 Flarum译者:justjavac
FluxBB 是一个快速、轻量级论坛软件,它的开发者是一名德国的 PHP 天才 Franz Liedke。FluxBB 的下一个版本(2.0)将被完全重写,并已经开发了一段时间。FluxBB 看起来非常有前途的,
java统计在线人数(session存储信息的)
macroli
java Web
这篇日志是我写的第三次了 前两次都发布失败!郁闷极了!
由于在web开发中常常用到这一部分所以在此记录一下,呵呵,就到备忘录了!
我对于登录信息时使用session存储的,所以我这里是通过实现HttpSessionAttributeListener这个接口完成的。
1、实现接口类,在web.xml文件中配置监听类,从而可以使该类完成其工作。
public class Ses
bootstrp carousel初体验 快速构建图片播放
qiaolevip
每天进步一点点 学习永无止境 bootstrap 纵观千象
img{
border: 1px solid white;
box-shadow: 2px 2px 12px #333;
_width: expression(this.width > 600 ? "600px" : this.width + "px");
_height: expression(this.width &
SparkSQL读取HBase数据,通过自定义外部数据源
superlxw1234
spark sparksql sparksql读取hbase sparksql外部数据源
关键字:SparkSQL读取HBase、SparkSQL自定义外部数据源
前面文章介绍了SparSQL通过Hive操作HBase表。
SparkSQL从1.2开始支持自定义外部数据源(External DataSource),这样就可以通过API接口来实现自己的外部数据源。这里基于Spark1.4.0,简单介绍SparkSQL自定义外部数据源,访
Spring Boot 1.3.0.M1发布
wiselyman
spring boot
Spring Boot 1.3.0.M1于6.12日发布,现在可以从Spring milestone repository下载。这个版本是基于Spring Framework 4.2.0.RC1,并在Spring Boot 1.2之上提供了大量的新特性improvements and new features。主要包含以下:
1.提供一个新的sprin