haiyupeter
- 浏览: 425863 次
- 性别:
- 来自: 广州
-
最新评论
-
xiaomuxingren：
你好，请问update-alternatives --inst ...
JDK8安装及jenkins安装 -
wahahachuang8：
我觉得这种东西自己开发太麻烦了，就别自己捣鼓了，找个第三方，方 ...
HTML5 WebSocket -
晨曦的朝阳：
刚好有需求，学习一下！
MySql主从配置 -
mfkvfn：
这是恶意的商业竞争呀
解决 android 微信5.0及后续版本无法打开电话号码的问题 -
fwyhf：
require('./monitor/module_liste ...
NodeJS Server 进程自动重启
文章列表
JavaScript基础：
JavaScript 基础认识JavaScript 对象定义JavaScript 继承JavaScript 事件JavaScript 正则JavaScript 闭包JavaScript 异常处理JavaScript Ajax
JavaScript进阶
CRSF攻击原理解析XSS攻击原理解析页面性能监控IE6下Aborted 解决方案跨域访问页面性 ...
一、数据连接池
对于数据库连接池的大致原理，可以参考这一篇文章
https://blog.csdn.net/zhanglongfei_test/article/details/123983770
基本解析了连接池在数据库中的基本应用
简单来说，连接池技术，即将与数据库连接的过程预先建立起来，并在业务调用方发起调用时提供分配，回收，管理等操作的一个管理模板的角色。（其中管理，可以理解为如超时、超连接数、与数据源断开等基本异常处理，并重新构建与数据源的连接等）
整个过程对于业务开发者透明，减少技术负担，并且减少数据源的连接耗时。
业务技术开发者使用时应注意什么 ...
先放上结论吧，Chrome和Firefox对js、css之类的文件，在内存中的缓存时长，是：（访问时间 - 该文件的最后修改时间） ÷ 10
假设文件 a.js 最后编辑时间是 2018年12月1号 10点0分0秒；
Chrome的第一次访问时间是 2018年12月1号 12点0分0秒；
第一次访问与文件编辑时间相差2小时，即7200秒，那么缓存时长就是720秒即结论如下：
1、在 2018年12月1号 12点0分1秒到 12点11分59秒，这12分钟内，浏览器不会发起http请求；
2、在 2018年12月1号 12点12分0秒，会发起带 If-Modified-Since ...
linux常用查看进程查找方法
- 博客分类：
- 运维
ps aux | grep apache 查看进程对应的端口号
root@objweb:~# ps aux | grep apache
www-data 8290 0.0 1.6 375776 17148 ? S 06:25 0:00 /usr/sbin/apache2 -k start
www-data 8291 0.0 1.5 375024 16128 ? S 06:25 0:00 /usr/sbin/apache2 -k start
www-data 8293 0.0 1.5 375024 16128 ? ...
JDK8安装及jenkins安装
- 博客分类：
- Java
1、下载
jdk-8u144-linux-x64.tar.gz 解压到 jvm 目录
2、解压到服务器目录
cd /usr/lib/jvm/
tar -zxvf jdk-8u144-linux-x64.tar.gz
3、编辑配置文件
vi /etc/profile
export JAVA_HOME=/usr/lib/jvm/jdk1.8.0_144
export CLASSPATH=.:$JAVA_HOME/lib
export PATH=$JAVA_HOME/bin:$PATH
source /etc/profile
4、更改默认JDK版本
由于系统中可能会有默认的其他版本JDK，所以， ...
基于上一篇《项目中使用webpack》，构建react的基本运行环境非常简单。
1、继续添加依赖
cnpm install babel-preset-react --save-dev //react解析规则
cnpm install react --save-dev
cnpm install react-dom --save-dev
2、在query中加入react
用于辅助react相关的解析
module: {
loaders: [{
test: path.join(__dirname, 'es6'),
loader: 'babel-loader',
...
近期react及vueJs的普及，ES6也有相应的推广及普及，前端的开发模式发生较大的改变。
基于此，开发提供webpack的支持，使开发能及时跟进前端的快速变化，保证项目开发与较新的技术接轨，提高开发效率。
1、安装nodeJS
https://nodejs.org/en/
nodeJS是基础运行环境，默认下载最新版本即可，提供对npm的支持
2、初始化工程
npm init
过程可以按照需要填写相应的配置信息，默认生成package.json文件（其中devDependencies中的babel后续内容讲解）
{
"name": "webpack-t ...
服务器端查询网络tcp日记神器 tcpdump。
tcpdump主要用于记录tcp请求的具体情况。
1、tcpdump的基本使用方法
tcpdump -i eth1 用于查询网上eth1上的网络情况
tcpdump -i eth1 -w /mnt/test.cap 将记录写在/mnt/test.cap文件中
tcpdump -i eth1 -w /mnt/test.cap h ...
PIXI 完整示例-PIXI文档翻译(7)
- 博客分类：
- JS进阶
案例研究：寻宝者
所以我告诉你，你现在有所有你需要开始制作游戏的技能。什么？你不相信我？让我向你证明吧！让我们接近如何使一个简单的对象集合和敌人回避游戏称为宝藏猎人。（你会找到它的examples 文件夹。）
宝 ...
PIXI 碰撞检测-PIXI文档翻译(6)
- 博客分类：
- JS进阶
你现在知道如何制作各种各样的图形对象，但你能用他们做什么？一个有趣的事情是构建一个简单的碰撞检测系统。你可以使用一个自定义函数 hitTestRectangle来检查任何两个矩形Pixi sprites是否接触。
hitTestRectangle(spriteOne, spriteTwo)
如果它们重叠，hitTestRectangle将返回true。您可以使用hitTestRectangle与if语句来检查两个精灵这样的之间的冲突：
if (hitTestRectangle(cat, box)) {
//There's a collision
} else {
//There ...
PIXI 基本图形-PIXI文档翻译(6)
- 博客分类：
- JS进阶
1、基本图形
使用图像纹理是制作精灵的最有用的方法之一，但Pixi也有自己的低级绘图工具。您可以使用它们来制作矩形，形状，线条，复杂的多边形和文本。并且，幸运的是，它使用与Canvas绘图API几乎相同的API，所以，如果你已经熟悉canvas，这里没有什么真正新的学习。但是最大的优点是，与Canvas绘图API不同，您使用Pixi绘制的形状是由GPU上的WebGL渲染的。Pixi允许您访问所有未使用的性能功率。让我们快速浏览如何制作一些基本形状。这里是我们将在代码中提出的所有形状。
(1)矩形
所有形状都是先创建 Pixi 的 Graphics 实例来实现
var rectangl ...
1、分组sprite
组可以创建游戏场景，并将类似的精灵一起管理为单个单元。Pixi有一个对象称为a Container ，让你这样做。让我们来看看它是如何工作的。
想象一下，你想显示三个精灵：猫，刺猬和老虎。创建它们，并设置他们的位置 - 但不要将它们添加到舞台上。
//The cat
var cat = new Sprite(id["cat.png"]);
cat.position.set(16, 16);
//The hedgehog
var hedgehog = new Sprite(id["hedgehog.png"]);
...
你现在知道如何显示精灵，但是你怎么让他们移动？这很容易：使用创建循环函数requestAnimationFrame。这被称为游戏循环。你放在游戏循环中的任何代码将每秒更新60次。这里有一些代码，你可以写使catsprite以每帧1像素的速率移动。
function gameLoop() {
//Loop this function at 60 frames per second
requestAnimationFrame(gameLoop);
//Move the cat 1 pixel to the right each frame
cat.x += 1; ...
1、通过spritesheets图创建sprite
你现在知道如何从单个图像文件制作精灵。但是，作为游戏设计师，你通常会使用tilesets（也称为spritesheets）来制作 sprite。Pixi有一些方便的内置方法来帮助你做到这一点。tileset是包含子图像的单个图像文件。子图像表示您要在游戏中使用的所有图形。这里是一个包含游戏角色和游戏对象作为子图像的tileset图像的示例。
整个图块集为192×192像素。每个图像都在一个自己的32 x 32像素的网格单元。存储和访问所有的游戏图形在一个tileset是一个非常处理器和内存高效的方式来处理图形，而Pixi是为他们优化 ...
1、定位Sprite
现在你知道如何创建和显示精灵，让我们了解如何定位和调整它们的大小。
在前面的例子中，猫精灵添加到舞台的左上角。该猫的x位置为0，y位置为0.您可以通过更改其值x和y属性的值来更改猫的位置。这里是如何通过将猫x和y属性值设置为96，使猫在舞台中央。
cat.x = 96;
cat.y = 96;
setup 在创建精灵后，在函数的任何位置添加这两行代码。
function setup() {
//Create the `cat` sprite
var cat = new Sprite(resources["images/cat.p ...