- 博客(82)
- 资源 (37)
- 收藏
- 关注
RSS订阅原创 Vite+React前端实践
Vite+React前端实践2021年2月17日，Vite2.0发布了，在前端圈引起了 不小的轰动。至于引起轰动的原因恐怕要数官网上介绍的这几点原因：去掉打包步骤，快速的冷启动。及时的模块热更新，不会随着模块变多而使得热更新变慢。真正的按需编译。Vite是基于浏览器native的ES module开发的，基于Bundleless思想。在了解Vite前，需要先了解Bundle和Bundleless。Bundle和Bundleless是两种开发方式，自 2015 年 ESM 标准发布后，这两种开发
2021-09-18 13:26:36
1850
原创 关于本地存储localForage
以前使用本地存储，首先会想到localstorage或者session storage,将要存储的数据转化成字符串后进行setItem操作，但是使用local storage 有几个问题： 1、它是同步的，不管数据多大，我们需要等待数据从磁盘读取和解析，这会减慢我们的应用程序的响应速度，如果放到移动设备上，可想而之。 2、仅支持字符串，如果是存对象还需要将对象JSON.stringify({na
2016-05-18 17:08:28
10014
1
原创 利用Express搭建空白工程
Express是基于nodejs的一个Web框架，它提供了一系列强大的特性帮助你开发一个强大而且灵活的web application.(1)官网：http://expressjs.com/中文站点： http://expressjs.jser.us/(2)建立一个web application的，Let’s go!1、下载nodejs，因为Express是建立在nodeJS的平台下的，所以首先我们要
2016-05-18 16:06:49
561
原创 前端资源汇总
淘宝阿里航旅事业部的面试题 https://github.com/jayli/jayli.github.com/issues/19 淘宝阿里航旅事业部前端必备技能列表 https://github.com/jayli/jayli.github.com/issues/16 github用户hacker2总结的前端资源列表 https://github.com/hacke2/hacke2.gi
2016-05-18 16:06:23
777
转载 [转载]解读2014之前端篇：任性的颠覆式改变
HTML5正式定稿，ECMAScript 6 规范从纸上走到现实2014年10月28日，W3C宣布HTML5正式定稿为标准，这不仅仅标志着历经8年的标准纷争告一段落，也代表着HTML5这个名词会逐步洗去铅华，其技术真正融入到Web开发的每个角落，就像当年Ajax一样，当大家不再大张旗鼓鼓吹概念和商业炒作时，正是其成熟时代到来了。HTML5规范和以前最大区别是让Web最基础架构从Web Page升级到
2016-05-18 16:05:41
982
原创 Angularjs中的标签模式和html5模式
浏览$location的实例代码我们不难发现，每次的url中都会带一个#,这是因为angularjs默认使用的是标签模式，它和html5模式有什么区别？ （1）标签模式 标签模式使用的是内部链接的技巧，URL后面紧跟一个#,angularjs本身不会重写标签，也不需要服务器端的支持，链接后的URL样子基本是这样的：http://example.com/#/some/path?foo=bar&ba
2016-05-18 16:05:11
4047
原创 搞颠provider,factory 和service
1、什么是provider provider可以为应用提供通用的服务，所有的服务工厂都是有provider提供的，可以提供字符串，对象等。我们先看下provider的源码：function provider(name, provider_) { assertNotHasOwnProperty(name, ‘service’); if (isFunction(provider_)
2016-05-18 16:04:49
651
原创 使用WebStorm调试node工程
coder比较偏好debug，调试node比较麻烦，我们借助高大上的工具webStorm(我用的是10)来调试node，配置也比较简单，直接上图： 首先，配置node环境，在导航栏选择”Edit/configuration”, wKioL1V2tlSBNlg4AAB_DyzeGkY678 接下来配置 wKiom1V2tM3xYJl8AAKv65JQYfU260 注：javascript f
2016-05-18 16:03:11
976
转载 自己构建mean framework
由于项目的原因，项目的前端架构要从单纯的angularjs转到nodejs+angular+express的架构，这样的架构对大家来说可能比较眼熟，没错，就是大名鼎鼎的MEAN (mongodb,express,angularjs,node) framework。随着nodejs技术的日益成熟(当然io.js也逐渐崛起，并且和node重归于好)，和其关联技术必将炙手可热，顺利成章地将全栈的概念更加普
2016-05-18 16:02:30
637
转载 [转载]汇总各浏览器核心(js引擎及排版引擎)深究
前言写本篇文章的初衷是追寻各浏览器对css、js实现性能而码，再说了，个人认为要做个负责前端应该要对其底层有所了解，这样在有的时候对bug能迅捷的对症下药。小熊花了近6个小时搜索相关资料加上本身开发的一些经验总结出本篇。起初开始的小熊只知道IE核心、FF核心、OP核心等（前些年的主流浏览器），而如今风行的Safari(本文简称SF)和Chrome(本文简称GG)，都是Webkit的开源核心，虽然代表
2016-05-18 16:01:56
967
原创 2015年要看完的书
这个不是2015年的全部书单，因为随时还会有新书补充进来，无论是纸质的还是电子版1、webkit技术内幕(部分章节精读)2、HTTP权威指南(参考，已经泛读)3、HTML5数据推送应用开发(精读)4、黑客与画家(已读)5、Web应用安全权威指南 , 白帽子讲Web安全 (精读)6、MEAN web development(已经完成)7、Github入门与实践8、Clean code(精读)9、Ra
2016-05-18 16:01:19
455
原创 测试angular中的service
在angularjs中，service是单例的，通常用来与后台交互数据，需要数据的组件只需要注入某个service即可，service的典型例子：app.factory(‘EventService’, [‘http′,′http', 'q’, function(http,http, q) { return { getEvents: function() {
2016-05-18 16:00:47
1165
原创 测试angular中的controller
angularjs中的controller主要负责业务逻辑的处理、数据模型，页面元素的展示等，通常一个controller会依赖一个或者多个service，通过service从数据库拉数据后保存到controller，controller的简陋的例子如下：app.controller(‘EventController’,[‘scope′,′EventService′,function(scope',
2016-05-18 16:00:24
446
原创 Moco in action
Moco 是一个轻量级的打桩框架，这个是构建在http协议上的，并且支持 Web service , REST等。对于前端来说，是实现前后端分离的关键，我们可以通过Moco配置返回数据模拟服务器返回的真实数据。我接下来将写两篇文章介绍怎么测试angular的controller和service，将用到Moco，这篇文章就作为铺垫吧。Moco快速入门：首先，从 repo1.maven.org/mave
2016-05-18 15:59:05
970
原创 Gulp in action
gulp 和grunt一样，都是任务自动管理工具，和grunt相比，gulp更加好用，配置也更加灵活。1、安装gulp也是基于nodejs的，同样可以通过npm安装，全局安装npm install -g gulp 在项目中安装npm install gulp –save-dev 2、两个例子创建名为gulpfile.js,在这个文件中通过gulp命令定义gulp 任务，在gulpfile.js添
2016-05-18 15:57:41
525
转载 Grunt in action
Grunt 是一个自动任务运行器，会安装预先定义的顺序自动运行一系列的的任务，可以简化工作流程，减少重复性的工作从而提高工作交流，这篇简易教程会从0着手详细介绍grunt。1、安装grunt是基于nodejs的，如果你还没有安装，请从http://nodejs.org/下载安装windows版或者Linux版，安装nodejs后，运行如下命令:sudo npm install -g grunt-cl
2016-05-18 15:57:18
387
转载 使用Grunt启动和运行
原文地址：http://www.smashingmagazine.com/2013/10/29/get-up-running-grunt/这篇文章中，我们将介绍如何在项目使用Grunt让你的网站更快。我们简要分析下grunt能够做什么，如何创建和使用各种插件完成各种繁重的任务。我们将看看如何构建一个简单的表单验证器，使用Sass预处理器，如何使用grunt-cssc和CssMin结合压缩我们的CSS
2016-05-18 15:56:53
2183
1
转载 angularjs中的interceptor和挺好的例子
原文地址：http://www.webdeveasy.com/interceptors-in-angularjs-and-useful-examples/AngularJS 的 $http 服务允许我们通过发送 HTTP 请求方式与后台进行通信。在某些情况下，我们希望可以捕获所有的请求，并且在将其发送到服务端之前进行操作。还有一些情况是，我们希望捕获响应，并且在完成调用之前处理。一个很常用的场景就是
2016-05-18 15:56:19
475
转载 angularjs培训之service
原文地址：http://angular-tips.com/blog/2013/08/understanding-service-types/Angular中有几种不同类型的services。每一种都有自己的独特用法。需要记住的非常重要的一点是service总是一个单体，无论是哪种类型的service，这是个很被期望的行为。注释：单体是一种设计模式，它限制了每一个类仅能够实例化为一个对象。无论我们在什
2016-05-18 15:55:54
250
转载 $watch How the $apply Runs a $digest
原文地址：http://angular-tips.com/blog/2013/08/watch-how-the-apply-runs-a-digest/这篇博文主要是写给新手的，是给那些刚刚开始接触Angular，并且想了解数据帮定是如何工作的人。如果你已经对Angular比较了解了，那强烈建议你直接去阅读源代码。Angular用户都想知道数据绑定是怎么实现的。你可能会看到各种各样的词汇：watch
2016-05-18 15:55:10
803
原创 angularjs中的$watch
在使用AngulaJS编写应用时，我们经常需要做的一件事情就是对模型中的变量进行监视，并对其发生的变化做出相应的回应。AngularJS为我们提供了一个非常方便的$watch方法，它可以帮助我们在每个scope中监视其中的变量。下面是一个非常简单的例子：<html ng-app=’myApp’> <head> <meta charset=”UTF-8”>
2016-05-18 15:54:04
674
转载 javascript Promises
原文地址：http://www.html5rocks.com/zh/tutorials/es6/promises/#toc-api女士们先生们，请准备好迎接 Web 开发历史上一个重大时刻……[鼓声响起]JavaScript 有了原生的 Promise！[漫天的烟花绽放，人群沸腾了]这时候你大概是这三种人之一：你的身边拥挤着欢呼的人群，但是你却不在其中，甚至你还不大清楚“Promise”是什么。你耸
2016-05-18 15:53:36
539
转载 拥抱javascript的Promise
原文地址：http://javascriptplayground.com/blog/2015/02/promises/?utm_source=javascriptweekly&utm_medium=email这篇文章我们一起来看下在异步编程事怎么拥抱promise，编写良好的代码。这篇不是全面深入地剖析Promise，如果想更全面的了解，Jake Archibald’s post on HTML5
2016-05-18 15:52:45
476
原创 Karma测试环境搭建
Karma是一个JavaScript的测试运行器。Karma更是一个测试环境，使用Karma可以很方便的的运行测试,今天我们简单地介绍一karma测试环境的搭建和基本的测试，我已经写好了一套测试用例，有谁需要可以私信我。官网如下：http://karma-runner.github.io/0.12/index.html我们总是实现完feature后再编写测试用例，但是根据TDD的原则，开发的流程一般
2016-05-18 15:52:11
1569
原创 XMLHttpRequest level2介绍
1、xmlHttpRequest level1:xmlHttpRequest是一个浏览器脚本语言，用来给server发送http或者https请求来加载，出于安全考虑，这个只能用于同域访问(还有其他的缺点，比如说不能读取或者上传二进制文件，传送和发送数据时没有进度信息)。Xmlhttprequest概念的形成是源于微软的outlook web access，后来使用这样的概念形成了msxml库，这就
2016-05-18 15:51:48
626
原创 ECMAScript5新特性之对象篇
1、Ojbect.create(O[,properties]):var Person = { name : ‘hcc’, hungry : false, play : function (){ this.hungry = true; return ‘I am playing!’;
2016-05-18 15:51:20
336
原创 ECMAScript5特性介绍之数组篇
Es5的特性以及发布很长时间了，增加了很多实用的特性(Array的 indexOf、every,some,forEach等，Object的create，keys,isFrozen等)，这些特性已经得到个浏览器的支持，比如：IE9+,FF21+,chrome23+,opera 15+,SF6+都已经基本支持全部特性。详细的特性检测见：http://kangax.github.io/compat-tab
2016-05-18 15:50:31
454
原创 AMD和CMD的区别，转载玉伯在知乎上的回答。
AMD 规范在这里：https://github.com/amdjs/amdjs-api/wiki/AMD CMD 规范在这里：https://github.com/seajs/seajs/issues/242AMD 是 RequireJS 在推广过程中对模块定义的规范化产出。 CMD 是 SeaJS 在推广过程中对模块定义的规范化产出。 类似的还有 CommonJS Modules/2.0
2016-05-18 15:49:59
533
原创 异步加载之seajs,同样值得拥有
1、 seajs概述：seajs是淘宝前端团队实现的基于commonjs规范的异步加载器，作者就是大名鼎鼎的玉伯。目标也是和requirejs一样，都是为了模块化和异步加载。2 、 资源github: https://github.com/seajs/seajs/doc: http://seajs.org/docs/#docs玉伯的github：https://github.com/lifesin
2016-05-18 15:49:17
557
原创 开发流程告诉你，为什么是软件工程师而不是码农
我们以一个APP成功上线，作为思考的起点，往前推，看看我们需要做些什么？1一个99美元的开发者帐号 嗯，如果不需要真机跑程序，这个可以是最后一步。当然早早买个开发帐号，好处会非常大，看到自己的程序在真机上跑，整个人都兴奋起来，就不用老喝鸡汤。2一个App包 当然，这才是真正难点。所以这里会有大量的细分步骤。1)异常控制 在所有数据都没有问题之后，我们需要反复用各种奇葩操作来把应用搞崩溃，或者把数据搞
2016-05-18 15:42:26
2069
原创 一般人都能看懂的git教程
git是一个分布式的版本控制工具，很轻松的就能管理Github的资源，如果你还在为找不到好的入门资源而苦恼的话，请戳下面的链接：http://backlogtool.com/git-guide/cn/本人也是个git小白，这个学习会往后放一下，以后好好学下。当然我的微博中也有很好的git资源，欢迎查询。微博地址：weibo.com/houyaowei
2016-05-18 15:41:56
397
原创 html5本地存储之indexedDb
对于以下需求：离线存储读取数据 允许用户对数据进行增删改操作 数据存储在本地，不依赖后端 数据支持索引查询 我们可以考虑使用html5新特性的本地存储，主要有以下几种：Web Sql(IE,FF都不支持,http://www.w3.org/TR/webdatabase/) IndexedDB Local Storage(轻松存储简单的数据结构，如果存储复杂的较麻烦) Session S
2016-05-18 15:41:27
736
原创 ECMAScript6学习之三
1、展开运算符(spread (…) operator)以前我们把某一个方法作为某一个对象的方法调用时，方法如下： function ecma(x, y, z) { alert('x:' + x + ", y=" + y + ', z=' + z); }var args = [0, 1, 2];ecma.apply(null, args);有了ECMAScript6就
2016-05-18 15:40:09
539
原创 EcmaScript6学习之二
1、Iterator浏览器支持情况：FF31+js中提供来很多方法遍历集合中的元素，比如说for, forEach, for …of ,map。在ES6中，iterator是一个对象，提供next()方法依次访问下一个元素。也就是说要使用next()方法，就需要先创建一个iterator对象，先看个例子：var lang = { name: ‘JavaScript’, birthYear: 1995
2016-05-18 15:39:28
446
原创 EcmaScript6学习之入门
1、const and for..of loops一个常量不可以被重新赋值,并且不能被重复声明浏览器支持情况：IE11,FF31+,chrome35+,opera2+,safari6+,node0.10+,const a = ‘const_a’; console.log(‘This is a const : ’ + a);//browser supply : FF31+ ,chrome37+,s
2016-05-18 15:36:45
458
原创 发现了个很好的前端代码规范和最佳实践，mark一下
前端规范而又完整的编码规范并不多见，如果你想找一个完整的，推荐你看下下面的链接内容，千万不能错过。http://coderlmn.github.io/code-standards/另：jquery编码风格js篇如下：http://contribute.jquery.org/style-guide/js/jquery编码风格html篇如下：http://contribute.jquery.org/st
2016-05-18 15:36:10
483
原创 EcmaScript5和EcmaScript6规范一览表
EcmaScript5.1规范于2011年6月发布，现在主流的浏览器基本上都已经支持，这些浏览起包括IE9、IE10，ff21及其以上，safari6及其以上,opera12及其以上都已经基本支持。具体的测试情况可以在线测试，用来确定你使用的浏览器是否支持。测试网站：http://kangax.github.io/compat-table/es5/详细的5.1规范描述可以下载到pdf文件和html文
2016-05-18 15:35:37
4508
原创 angularjs培训之directive（1）
原文链接：http://www.sitepoint.com/practical-guide-angularjs-directives/在angular程序中directive是很重要的组件。尽管Angularjs内置了很多的指令，但是你也经常需要创建特定功能的指令。这篇文章给大家一个指令的基本概述并且详解怎么使用。overviewdirective引进了新的语法声明。directive是通过绑定在D
2016-05-18 15:35:09
262
java编程思想第四版
2010-10-21
c编程要点
2007-05-09
c高级编程
2007-05-09
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人