- 浏览: 197032 次
最新评论
文章列表
使用babel编译es6
- 博客分类:
- 打包构建
一.直接使用命令编译
node命令:
$ sudo npm install babel -g #全局安装
$ babel demo.js -o demo-compile.js #编译并产出
二.结合gulp编译
1.需要先安装gulp,gulp-babel
$ npm install --save-dev gulp-babel
2.然后新建gulpfile.js
...
Phantomjs、CasperJS
大名鼎鼎的PhantomJS当然要隆重介绍啦!前面界面对比测试基本都是基于PhantomJS开发的, Phantom JS是一个服务器端的 JavaScript API 的 WebKit。其支持各种Web标准: DOM 处理, CSS 选择器, JSON, Canvas, 和 SVG。对于web测试、界面、网络捕获、页面自动化访问等等方面可以说是信手拈来。
casperjs是对PhantomJS的封装,提供了更加易用的API, 增强了测试等方面的支持。例如通过CasperJS可以轻松实现贴吧的自动发帖功能:
casper.test.begin('测 ...
在前端开发中,性能一直都是被大家所重视的一点,然而判断一个网站的性能最直观的就是看网页打开的速度。其中提高网页反应速度的一个方式就是使用缓存。一个优秀的缓存策略可以缩短网页请求资源的距离,减少延迟,并且由于缓存文件可以重复利用,还可以减少带宽,降低网络负荷。那么下面我们就来看看服务器端缓存的原理。
缓存分类
web缓存分为很多种,比如数据库缓存、代理服务器缓存、还有我们熟悉的CDN缓存,以及浏览器缓存。对于太多文字的阅读其实我是拒绝的,于是就画了个图来解释下。
浏览器通过代理服务器向源服务器发起请求的原理如下图,
生成jsbundle文件,打本地包
- 博客分类:
- 前端框架
初始化react-native项目
react-native init <project name>
运行bundle服务
react-native start
生成bundle文件 - ios
react-native bundle --entry-file index.ios.js --bundle-output ios/main.jsbundle --platform ios --assets-dest ./ios --dev false
生成bundle文件 - android
react-native bundle --platform ...
https协议下IE下载报错解决
- 博客分类:
- 兼容问题
错误如下图: 解决方法:
后台设置请求头
response.addHeader("Pragma", "public");
response.addHeader("Cache-Control", "max-age=0");
在线聊天室(带历史记录显示功能)
依赖环境:node.js
依赖的模块:express, socket.io
示例代码见附件,解压后运行: npm install ,安装依赖模块,然后运行机制:node index.js
浏览器访问:localhost:3000/index.html
服务端代码:
var express = require('express');
var app = express();
var path = require('path');
var http = require('http').Server(app);
var io = ...
打包工具:webpack
主要依赖包: react-web, babel, react,react-dom....
webpack.config.js代码:
'use strict';
var fs = require('fs');
var path = require('path');
var webpack = require('webpack');
var HtmlPlugin = require('webpack-html-plugin');
var HasteResolverPlugin = require('haste-resolver-webpack-pl ...
IE矩阵滤镜Matrix旋转
- 博客分类:
- 研究实验
SS3 transform与IE filter
.trans_skew { transform: skew(35deg); }
.trans_scale { transform:scale(1, 0.5); }
.trans_rotate { transform:rotate(45deg); }
.trans_translate { transform:translate(10px, 20px); }
http://www.useragentman.com/IETransformsTranslator/
#transformedObject {
...
require.js是一种基于AMD规范的模块加载器,至于什么是AMD规范,就不在这里详细描述了,有兴趣了解的可以去问度娘(^_^)
主要用到的就是两个方法:defind, require...
require.config() // 定义requirejs的相关配置
如:
requirej ...
[js] RSA加密
- 博客分类:
- 加密算法
js版RSA加密实现
// Copyright (c) 2005 Tom Wu
// All Rights Reserved.
// See "LICENSE" for details.
// Basic JavaScript BN library - subset useful for RSA encryption.
// Bits per digit
var dbits;
// JavaScript engine analysis
var canary = 0xdeadbeefcafe;
var j_lm = ((canary&0 ...
[js] AES+Base64+Utf8算法
- 博客分类:
- 加密算法
js实现的AES+Base64+Utf8算法
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/* AES implementation in JavaScript (c) Chris Veness 2005-2012 */
/* - see http://csrc.nist.gov/publications/PubsFIPS.html#197 ...
[js] MD5算法
- 博客分类:
- 加密算法
js版md5算法:
/**
*
* MD5 (Message-Digest Algorithm)
* http://www.webtoolkit.info/
*
**/
var MD5 = function (string) {
function RotateLeft(lValue, iShiftBits) {
return (lValue<<iShiftBits) | (lValue>>>(32-iShiftBits));
}
function AddUnsigned(l ...
ES6新特性
class 类 (extends继承)
@example:
class Player {
constructor(x, y) {
this.x = 0;
this.y = 0;
}
getPosition() {
return this.x + ',' + this.y;
}
jumpFoward() {
this.x = this.x + 1;
}
jumpBackwards() {
this.x = this.x - 1;
}
}
import 引入外部模块
@ ...
ES6令人激动的特性
- 博客分类:
- ES6/7
Nick Justice是GitHub开发者计划的一员。早在ES6语言标准发布之前,他就借助像Babel这样的转译器以及最新版本的浏览器在自己的项目中使用ES6特性。他认为,ES6的新特性将极大地改变JavaScript的编写方式。近日,他在一篇博文中介绍了多项令人激动的特性:
Promises:对于JavaScript而言,promises不是什么新东西,许多库都提供了这一特性。但现在,它正式成为ES6语言标准的一部分。
直接进入正文吧。
安装Babel
1
$ npm install -g babel
好了,没什么好说的。