- 博客(211)
- 资源 (63)
- 收藏
- 关注

原创 我的React前端工程化模板&组件库
react-template-easilyDesc: react-template-easily 是一套以react技术搭建的项目模板,适用于移动端H5, webapp和hybirdApp开发。其中包含常用20+常用组件,精细计算的rem,以及诸多项目的实践。URL:https://github.com/jinjiaxing/react-template-easily
2017-11-10 19:39:37
4361

原创 reactjs性能优化之shouldComponentUpdate
更多内容请关注:性能优化每当开发者选择将react用在真实项目中时都会先问一个问题:使用react是否会让项目速度更快,更灵活,更容易维护。此外每次状态数据发生改变时都会进行重新渲染界面的处理做法会不会造成性能瓶颈?而在react内部则是通过使用一些精妙的技巧来最小化每次造成ui更新的昂贵的dom操作从而保证性能的。避免直接作用于DOMreact实现了一层虚拟dom,它用来映射浏览器的原生dom树...
2015-11-16 18:00:34
32678
7
原创 时间复杂度
前言工作时间长了,难免对这些知识有一些遗忘,我们还是复习下 时间复杂度的概念和如何计算吧相关概念算法:算法是指解题方案的准确而完整的描述,是一系列解决问腿的清晰指令,算法代表着用系统的方法描述解决问题的策略机制。算法的效率:是指算法执行的时间,算法执行时间需要通过算法编制的程序在计算机上运行时所消耗的时间来衡量。一个算法的优劣可以用空间复杂度和时间复杂度来衡量。时间复...
2019-03-18 11:17:55
231
转载 react 16中的context你知道多少?
关于react中context的说明,在掘金上看到的,转过来,大家看下~写的简单明朗抛出问题在平时使用react的过程中,数据都是自顶而下的传递方式,例如,如果在顶层组件的state存储了theme主题相关的数据作为整个App的主题管理。那么在不借助任何第三方的状态管理框架的情况下,想要在子组件里获取theme数据,就必须的一层层传递下去,即使两者之间的组件根本不需要该数据;就如同下...
2019-03-06 16:56:07
910
原创 react中的setState是同步还是异步还是?
setState 只在合成事件和钩子函数中是“异步”的,在原生事件和 setTimeout 中都是同步的。 合成事件:就是react 在组件中的onClick等都是属于它自定义的合成事件 原生事件:比如通过addeventListener添加的,dom中的原生事件 setState的“异步”并不是说内部由异步代码实现,其实本身执行的过程和代码都是同步的...
2019-03-06 16:04:59
15843
原创 Redux源码分析(二)之combineReducers
Redux源码分析(combineReducers)上一篇我们看完了createStore这个自认为最为核心的文件之后,我们再来看下combineReducers.js这个文件,其他它最主要的作用就是合并多个reducer,因为在createStore中的第一个参数就是一个reducer,而平时我们开发过程中如果将全部状态都写在一个文件中有一些过于庞大且不好管理,因此我们可以先拆开去写reduc...
2018-11-07 15:43:38
215
原创 Redux源码分析(一)
Redux源码分析使用redux都快3年了,到现在也没认真去了解一下源码罪过啊,所以需要对它进行一些分析和学习,一方面能更好的去使用它,另一方面也学习一下该框架的设计思路,首先我们看到 redux/src/index.js 文件export { createStore, combineReducers, bindActionCreators, applyMiddleware,...
2018-11-06 16:46:39
292
转载 浏览端渲染性能相关(转自google开发者中心)
现在的网络用户希望他们访问的页面具有交互性并且运行顺畅,这正是您需要投入越来越多时间和精力的地方。页面不仅要快速加载,而且要顺畅地运行;滚动应与手指的滑动一样快,并且动画和交互应如丝绸般顺滑。要编写高性能的网站和应用,您需要了解浏览器如何处理 HTML、JavaScript 和 CSS,并确保您编写的代码(和您要包括的其他第三方代码)尽可能高效地运行。60fps 与设备刷新
2017-12-18 14:47:53
224
原创 客户端区域坐标转换为 Canvas 坐标
通过 MouseEvent.clientX和 MouseEvent.clientY 可以获得鼠标在浏览器客户端区域的坐标。借助 Element.getBoundingClientRect()方法来实现客户端区域坐标与 canvas 坐标之间的转换。function windowToCanvas (canvas, x, y) { var bbox = canvas.get
2017-04-15 12:53:35
1669
转载 解决iscroll.js上拉下拉刷新手指划出屏幕页面无法回弹问题
使用过iscroll.js的上拉下拉刷新效果的朋友应该都碰到过这个问题:在iOS的浏览器中,上拉或下拉刷新时,当手指划出屏幕后,页面无法弹回。很多人因为解决不了这个问题,干脆就那样不解决了,还有的直接就不用HTML了,使用原生代替HTML页面。相信很多朋友也有自己的解决办法,只是没写出来,所以网上都搜不到解决方案。在很多QQ群里面也有很多人在问该怎么解决这个问题,所以我写这篇文章记录一下我
2017-03-29 11:44:56
690
1
转载 DOCTYPE
DTD(document type definition,文档类型定义)是一系列的语法规则, 用来定义XML或(X)HTML的文件类型。浏览器会使用它来判断文档类型, 决定使用何种协议来解析,以及切换浏览器模式。事实上DTD可以定义所有SGML语族的文档类型,但由于太过繁琐, XML Schema反而更加流行。多数HTML编辑器都会为我们添加一行DOCTYPE声明,但DOC
2017-03-22 12:00:04
383
原创 Git命令总结
对比svn优势:①分布式管理,无网络也可以继续使用 ②强大的分支管理,对比svn的分支,速度性能易用上都显而易见1.git 安装 自己去搜索吧2.git init 初始化,会在目录下新创建一个 .git目录,mac下查看隐藏文件可以用 ls -ah3.git add ‘文件’ 或者 g
2017-02-08 16:02:21
340
原创 Android中line-height不居中的解决办法
android的webview中,line-height的垂直居中 对于字体小于12px的无效,主要是因为避免奇数font-size带来的偏差,设置成了偶数,所有会有一些偏上解决办法:1. 改变字体大小 最直接的方法就是改变字体大小让它大于 12px 能够正常居中,如果页面对字体大小要求比较严格的话,可以先将原来包括 font-size 在内的属性放大两倍,再用 scale 缩
2016-12-22 14:16:50
8020
1
原创 css 实现 0.5 px 的 border
在做手机页面的时候,有时候需要模仿原生的那种 1px 下划线的效果,普通的 css 1px 看起来比原生的粗,所以我们可以考虑实现 0.5px 的border 来实现这个效果,因为只有少数的设备才支持 0.5px 这个属性值,所以我们只能通过其他办法来实现,比如:<div class="btn">.5px border</div> .btn { ...
2016-12-21 15:20:31
3327
转载 理解JSBridge
随着HTML5的不断普及及优化,其在移动端开发的应用也越来越多,在开发者我们经常需要web和native进行交互,也就是要用到经常听到的“JSBridge”。这里我就自己的理解及实践,讲一下什么是JSBridge。有些朋友听到JSBridge,会觉得是个蛮高大上的东西,好像很厉害很复杂的样子,有了它web和native都能交互了呢。其实并非如此,相信我,JSBridge真的是一个非常非常简
2016-10-11 16:06:34
9896
原创 tree-shaking
先问一个问题:对于打包后的文件你关注的是什么?简单的变量话的压缩技术已经不够了其实13年就有一篇外文专门介绍了单纯压缩已经远远不够了,稍后我们也会放出原文它的由来?最早是 rollup 的作者 Rich Harris 在自己的打包工具中设计的一个特性It only includes the bits
2016-08-10 11:47:56
908
转载 前端路由实现与 react-router 源码分析
原文地址在单页应用上,前端路由并不陌生。很多前端框架也会有独立开发或推荐配套使用的路由系统。那么,当我们在谈前端路由的时候,还可以谈些什么?本文将简要分析并实现一个的前端路由,并对 react-router 进行分析。一个极简前端路由实现说一下前端路由实现的简要原理,以 hash 形式(也可以使用 History API 来处理)为例,当 url 的 hash
2016-05-25 17:14:28
3432
翻译 Reflux
前言在细说Flux之前,还是得提一下React ,毕竟Flux这个名字,是因为它才逐渐进入到大众视野。React是facebook提出来的一个库,用来构建用户界面(User Interface),它的三大特点(来自官方):JUST THE UI: 仅仅是一个View(components),可以认为是MVC中V,用来构建UI界面。VIRTUAL DOM
2016-04-14 15:26:08
639
转载 JavaScript 原型系统的变迁,以及 ES6 class
概述注:原文放在 SegmentFault 。如果你想看到更清晰的目录,可以去看原文。除此之外,本文不缺少任何内容。JavaScript 的原型系统是最初就有的语言设计。但随着 ES 标准的进化和新特性的添加。它也一直在不停进化。这篇文章的目的就是梳理一下早期到 ES5 和现在 ES6,新特性的加入对原型系统的影响。如果你对原型的理解还停留在 function + ne
2016-03-28 11:56:54
638
原创 Browserify —— 利用Node.js实现JS模块化加载
Browserify 可以让你使用类似于 node 的 require() 的方式来组织浏览器端的 Javascript 代码,通过预编译让前端 Javascript 可以直接使用 Node NPM 安装的一些库。安装:npm install -g browserify示例这是 main.js 的内容,像普通的 nodejs 程序那样使用 require() 加载库和文
2016-02-19 19:46:34
653
转载 ES6新特性概览
本文基于lukehoban/es6features ,同时参考了大量博客资料,具体见文末引用。ES6(ECMAScript 6)是即将到来的新版本JavaScript语言的标准,代号harmony(和谐之意,显然没有跟上我国的步伐,我们已经进入中国梦版本了)。上一次标准的制订还是2009年出台的ES5。目前ES6的标准化工作正在进行中,预计会在14年12月份放出正式敲定的版本。但大部分标准
2015-12-02 14:19:23
476
转载 iscroll原理
做过移动端开发的应该多少听过iscroll,iscroll是用来模拟移动端滚动效果的库iscroll的出现移动app的布局一般是顶部header+固定高度内容区+footer这种需求在PC端很简单,header、footer用固定定位,content设置上下margin和overflow:scroll,就ok了,木有啥问题但是在移动端,首先关于pos
2015-11-19 19:16:55
4295
原创 chrome调试webview
1.来看下高大上的chrome://inspect 通过它和USB,你可以调试andriod手机上的h5页面,非常的方便和强大。 它支持以下的调试: 1.浏览器tab页打开的h5页面 2.webview里面打开的页面 3.实时将你andriod设备的屏幕录制到你的开发机上 4.通过port forwarding和virtual host mapping调试你自己的开发服务器
2015-11-17 22:26:34
2854
转载 Flux 傻瓜教程
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。作者:寸志链接:http://zhuanlan.zhihu.com/FrontendMagazine/19900243来源:知乎应该使用 Flux 吗?如果你的应用需要处理动态的数据,那很可能需要使用 Flux。如果只是一些静态的视图,它们之间不共享状态,你也没什么数据保存或者更新,就不需要使用 F
2015-11-09 21:03:46
2819
转载 ReactJS 傻瓜教程
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。作者:范洪春链接:http://zhuanlan.zhihu.com/FrontendMagazine/19896745来源:知乎在相当长的一段时间内,我很努力地去尝试理解 React 是什么以及它在应用架构上的健壮程度。这篇文章解答了我希望别人为我解答的疑惑。React 是什么?和 Angul
2015-11-09 21:00:43
663
转载 css中position属性(absolute|relative|static|fixed)
我们先来看看CSS3 Api中对position属性的相关定义:static:无特殊定位,对象遵循正常文档流。top,right,bottom,left等属性不会被应用。 relative:对象遵循正常文档流,但将依据top,right,bottom,left等属性在正常文档流中偏移位置。而其层叠通过z-index属性定义。 absolute:对象脱离正常文档流,使用top,right,b
2015-11-08 13:20:00
395
转载 前端性能优化的14个规则
作为一个半前端工程师,而且只会写点HTML5和CSS3的“假”前端工程师,为了能更好地理解一下前端的花花世界,最近拜读了《高性能网站建设指南》一书,对作者提出的前端性能优化的14个规则获益匪浅,为了让自己印象更深刻点,决定作此文,当做学习笔记也好,知识总结也罢,总归看过的东西要让自己很好地掌握很好地运用起来才是王道。在解读这些规则的同时,我会用我一年半多的移动网站开发经历提出一些针对移动网站的优化
2015-09-07 12:30:34
439
原创 总结一些常见web前端面试题
1.js中apply和call的作用和区别是什么?①主要作用其实就是改变了函数运行时的上下文,简单来讲就是改变所调用函数this的指向,第一个参数是什么对象,此时this就指向这个对象。当一个object没有某个方法,但是其他的有,我们可以借助call或apply用其它对象的方法来操作。②二者区别仅仅是第二个参数不同,call需要按照顺序一个一个写入,而apply是数组形式,也可以通过
2015-08-24 10:19:22
986
转载 CSS hack方式一览
做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况。基于此,某些情况我们会极不情愿的使用这个不太友好的方式来达到大家要求的页面表现。我个人是不太推荐使用hack的,要知道一名好的前端,要尽可能不使用hack的情况下实现需求,做到较好的用户体验。可是啊,现实太残酷,浏览器厂商之间历史遗留的问题让我们在目标需求下不得不向hack妥协,虽然这只是个别情况。今天,结合自己的经
2015-08-21 10:00:01
340
转载 javascript逻辑运算符“||”和“&&”
一、先来说说||(逻辑或),从字面上来说,只有前后都是false的时候才返回false,否则返回true。alert(true||false); // truealert(false||true); // truealert(true||true); // truealert(false||false); // false但是,从深层意义上来说的
2015-08-21 09:11:55
346
转载 DOM事件简介
Click、touch、load、drag、change、input、error、risize — 这些都是冗长的DOM(文档对象模型)事件列表的一部分。事件可以在文档(Document)结构的任何部分被触发,触发者可以是用户操作,也可以是浏览器本身。事件并不是只是在一处被触发和终止;他们在整个document中流动,拥有它们自己的生命周期。而这个生命周期让DOM事件有更多的用途和可扩展性。
2015-08-20 15:12:49
918
转载 手机分辨率和webapp分辨率的关系
进行移动web开发已经有一年多的时间了,期间遇到了一些令人很困惑的东西。比如:我们经常使用的里的viewport究竟是什么意思,这里的device-width跟我们用JS获取到的屏宽的区别与联系分别是什么,为什么去掉标签后页面会变得很小很小?为什么很多分辨率很大的屏幕宽度其实并不大,屏幕分辨率与用JS获取到的屏宽的区别与联系分别又是什么?等等这些关于“像素”、关于“宽度”的一系列问
2015-07-17 11:38:48
8188
转载 Hybrid App开发 四大主流移平台分析
Hybrid App开发 四大主流移平台分析 Hybrid App在过去的两年中已经成为移动界的核心话题,但是作为一名Web开发者来说要如何站在移动互联网的浪潮之巅呢?是选择学习原生开发,研究Java、Object-C、C#等语言,还是选择继续使用网页开发,容忍HTML5功能的局限性?就在开发者左右为难的情况下Hybrid App作为一个折中的解决方案诞生了。那么究竟什么才是H
2015-05-13 22:54:25
850
转载 Angular JS + Express JS入门搭建网站
3月份开始,接到了新的任务,跟UI开发有关,用的是Angular JS,Express JS等技术。于是周末顺便学习下新技术。 组里产品UI架构如下: 其中前端,主要使用Angular JS框架,另外配合Bootstrap提供的很多控件以及JQuery,后台主要是Express JS搭建的Web Server,Express JS配合Nginx使用非常方便。
2015-05-13 22:54:18
464
原创 一些前端库的收藏
:1:Textillate.js – 实现动感的 CSS3 文本动画的简单插件 官网:http://jschr.github.io/textillate/
2015-05-07 21:49:56
425
原创 css3 做成的音频波动效果
音频波效果 #container{ position:relative; } #container span{ width:5px; height: 5px; top:0px;
2015-04-28 12:04:34
11681
转载 CSS3 Transitions, Transforms和Animation使用简介与应用展示
一、前言兼目录索引《天龙八部》里的虚竹小和尚之前可以说是和尚的先进人物与代表模范,各类清规戒律谨记与严守。但是,后来呢,花姑娘送到跟前,什么戒律都成了浮云,禁不住诱惑享乐去了。啊,我现在似乎有类似的感觉,本来不打算深究CSS3的一些属性的,但是其效果以及实际应用价值之诱惑实在巨大,还是抵挡不住,折腾下了这篇文章。劳民伤财的工程越少越好,所以,这里干脆把CSS3 动画相关的几个属性凑合到一起
2015-04-23 15:14:43
591
转载 XMLHttpRequest对象
写在前面的话:浏览器大战使得浏览器之间的标准无法统一,直接导致了我们在做Web应用系统时,不得不考虑多种兼容方案,创建XMLHttpRequest对象即是如此.创建XMLHttpRequest对象1.创建新的XMLHttpRequest对象script type="text/javascript"> var xmlHttp = new XMLHt
2015-03-31 15:50:44
383
Aleo Flash banner制作工具
2011-02-18
AspNetMVCPreview2-setup.msi
2010-11-19
突破WinXP IIS的连接数限制 工具 MetaEdit
2010-07-20
c# 3D游戏开发Managed DirectX 9中文版
2010-05-20
数据结构(C#版高清中文PDF)
2010-01-18
c#3.0语言规范高清PDF
2010-01-18
SQL语言艺术.rar
2010-01-18
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人