自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

Jason's Word

专注web前端,业余DOTNET&Flex

原创 我的React前端工程化模板&组件库

react-template-easily Desc: react-template-easily 是一套以react技术搭建的项目模板,适用于移动端H5, webapp和hybirdApp开发。其中包含常用20+常用组件,精细计算的rem,以及诸多项目的实践。 URL: ...

2017-11-10 19:39:37 2645 0

原创 Web前端填坑记录(持续更新)

主要记录自己开发时候遇到的坑,以及一些解决办法

2016-12-21 14:55:11 724 0

原创 reactjs性能优化之shouldComponentUpdate

更多内容请关注:性能优化每当开发者选择将react用在真实项目中时都会先问一个问题:使用react是否会让项目速度更快,更灵活,更容易维护。此外每次状态数据发生改变时都会进行重新渲染界面的处理做法会不会造成性能瓶颈?而在react内部则是通过使用一些精妙的技巧来最小化每次造成ui更新的昂贵的dom...

2015-11-16 18:00:34 29989 7

原创 时间复杂度

前言 工作时间长了,难免对这些知识有一些遗忘,我们还是复习下 时间复杂度的概念和如何计算吧 相关概念 算法:算法是指解题方案的准确而完整的描述,是一系列解决问腿的清晰指令,算法代表着用系统的方法描述解决问题的策略机制。 算法的效率:是指算法执行的时间,算法执行时间需要通过算法编制的程序在计...

2019-03-18 11:17:55 82 0

转载 react 16中的context你知道多少?

关于react中context的说明,在掘金上看到的,转过来,大家看下~写的简单明朗 抛出问题 在平时使用react的过程中,数据都是自顶而下的传递方式,例如,如果在顶层组件的state存储了theme主题相关的数据作为整个App的主题管理。那么在不借助任何第三方的状态管理框架的情况下,想...

2019-03-06 16:56:07 335 0

原创 react中的setState是同步还是异步还是?

setState 只在合成事件和钩子函数中是“异步”的,在原生事件和 setTimeout 中都是同步的。 合成事件:就是react 在组件中的onClick等都是属于它自定义的合成事件 原生事件:比如通过addeventListener添加的,dom中的原生事件 ...

2019-03-06 16:04:59 4595 0

原创 Redux源码分析(二)之combineReducers

Redux源码分析(combineReducers) 上一篇我们看完了createStore这个自认为最为核心的文件之后,我们再来看下combineReducers.js这个文件,其他它最主要的作用就是合并多个reducer,因为在createStore中的第一个参数就是一个reducer,而平时...

2018-11-07 15:43:38 121 0

原创 Redux源码分析(一)

Redux源码分析 使用redux都快3年了,到现在也没认真去了解一下源码罪过啊,所以需要对它进行一些分析和学习,一方面能更好的去使用它,另一方面也学习一下该框架的设计思路,首先我们看到 redux/src/index.js 文件 export { createStore, combine...

2018-11-06 16:46:39 164 0

转载 浏览端渲染性能相关(转自google开发者中心)

现在的网络用户希望他们访问的页面具有交互性并且运行顺畅,这正是您需要投入越来越多时间和精力的地方。页面不仅要快速加载,而且要顺畅地运行;滚动应与手指的滑动一样快,并且动画和交互应如丝绸般顺滑。 要编写高性能的网站和应用,您需要了解浏览器如何处理 HTML、JavaScript 和 CSS,并...

2017-12-18 14:47:53 147 0

原创 客户端区域坐标转换为 Canvas 坐标

通过 MouseEvent.clientX 和 MouseEvent.clientY 可以获得鼠标在浏览器客户端区域的坐标。借助 Element.getBoundingClientRect() 方法来实现客户端区域坐标与 canvas 坐标之间的转换。 function window...

2017-04-15 12:53:35 1428 0

转载 解决iscroll.js上拉下拉刷新手指划出屏幕页面无法回弹问题

使用过iscroll.js的上拉下拉刷新效果的朋友应该都碰到过这个问题:在iOS的浏览器中,上拉或下拉刷新时,当手指划出屏幕后,页面无法弹回。很多人因为解决不了这个问题,干脆就那样不解决了,还有的直接就不用HTML了,使用原生代替HTML页面。 相信很多朋友也有自己的解决办法,只是没写出来,...

2017-03-29 11:44:56 512 1

转载 DOCTYPE

DTD(document type definition,文档类型定义)是一系列的语法规则, 用来定义XML或(X)HTML的文件类型。浏览器会使用它来判断文档类型, 决定使用何种协议来解析,以及切换浏览器模式。 事实上DTD可以定义所有SGML语族的文档类型,但由于太过繁琐, XML ...

2017-03-22 12:00:04 305 0

原创 Git命令总结

对比svn优势:①分布式管理,无网络也可以继续使用                         ②强大的分支管理,对比svn的分支,速度性能易用上都显而易见 1.git 安装 自己去搜索吧 2.git init 初始化,会在目录下新创建一个 .git目...

2017-02-08 16:02:21 264 0

原创 Android中line-height不居中的解决办法

android的webview中,line-height的垂直居中 对于字体小于12px的无效,主要是因为避免奇数font-size带来的偏差,设置成了偶数,所有会有一些偏上 解决办法: 1. 改变字体大小 最直接的方法就是改变字体大小让它大于 12px 能够正常居中,如果页面对字体大...

2016-12-22 14:16:50 7155 1

原创 css 实现 0.5 px 的 border

在做手机页面的时候,有时候需要模仿原生的那种 1px 下划线的效果,普通的 css 1px 看起来比原生的粗,所以我们可以考虑实现 0.5px 的border 来实现这个效果,因为只有少数的设备才支持 0.5px 这个属性值,所以我们只能通过其他办法来实现,比如: <div cl...

2016-12-21 15:20:31 2439 0

转载 理解JSBridge

随着HTML5的不断普及及优化,其在移动端开发的应用也越来越多,在开发者我们经常需要web和native进行交互,也就是要用到经常听到的“JSBridge”。这里我就自己的理解及实践,讲一下什么是JSBridge。 有些朋友听到JSBridge,会觉得是个蛮高大上的东西,好像很厉害很复杂的样...

2016-10-11 16:06:34 9462 0

原创 tree-shaking

先问一个问题: 对于打包后的文件你关注的是什么? 简单的变量话的压缩技术已经不够了 其实13年就有一篇外文专门介绍了单纯压缩已经远远不够了,稍后我们也会放出原文 它的由来? 最早是 rollup 的作者 Rich Harris 在自己的打包工具中设计的一个特性 ...

2016-08-10 11:47:56 831 0

转载 前端路由实现与 react-router 源码分析

原文地址 在单页应用上,前端路由并不陌生。很多前端框架也会有独立开发或推荐配套使用的路由系统。那么,当我们在谈前端路由的时候,还可以谈些什么?本文将简要分析并实现一个的前端路由,并对 react-router 进行分析。 一个极简前端路由实现 说一下前端路由实现的简要...

2016-05-25 17:14:28 3292 0

翻译 Reflux

前言 在细说Flux之前,还是得提一下React ,毕竟Flux这个名字,是因为它才逐渐进入到大众视野。 React是facebook提出来的一个库,用来构建用户界面(User Interface),它的三大特点(来自官方): JUST THE UI: 仅仅是一个Vi...

2016-04-14 15:26:08 555 0

转载 JavaScript 原型系统的变迁,以及 ES6 class

概述 注:原文放在 SegmentFault 。如果你想看到更清晰的目录,可以去看原文。除此之外,本文不缺少任何内容。 JavaScript 的原型系统是最初就有的语言设计。但随着 ES 标准的进化和新特性的添加。它也一直在不停进化。这篇文章的目的就是梳理一下早期到 ES5 和现在 E...

2016-03-28 11:56:54 534 0

原创 Browserify —— 利用Node.js实现JS模块化加载

Browserify 可以让你使用类似于 node 的 require() 的方式来组织浏览器端的 Javascript 代码,通过预编译让前端 Javascript 可以直接使用 Node NPM 安装的一些库。 安装: npm install -g browserify 示例 ...

2016-02-19 19:46:34 485 0

转载 ES6新特性概览

本文基于lukehoban/es6features ,同时参考了大量博客资料,具体见文末引用。 ES6(ECMAScript 6)是即将到来的新版本JavaScript语言的标准,代号harmony(和谐之意,显然没有跟上我国的步伐,我们已经进入中国梦版本了)。上一次标准的制订还是2009年...

2015-12-02 14:19:23 431 0

转载 iscroll原理

做过移动端开发的应该多少听过iscroll,iscroll是用来模拟移动端滚动效果的库 iscroll的出现 移动app的布局一般是顶部header+固定高度内容区+footer 这种需求在PC端很简单,header、footer用固定定位,content设置上下...

2015-11-19 19:16:55 3894 0

原创 chrome调试webview

1.来看下高大上的chrome://inspect  通过它和USB,你可以调试andriod手机上的h5页面,非常的方便和强大。 它支持以下的调试: 1.浏览器tab页打开的h5页面  2.webview里面打开的页面  3.实时将你andriod设备的屏幕录制到你的开发机上  4.通过...

2015-11-17 22:26:34 2623 0

转载 Flux 傻瓜教程

著作权归作者所有。 商业转载请联系作者获得授权,非商业转载请注明出处。 作者:寸志 链接:http://zhuanlan.zhihu.com/FrontendMagazine/19900243 来源:知乎 应该使用 Flux 吗? 如果你的应用需要处理动态的数据,那很可能需要使用 ...

2015-11-09 21:03:46 2007 0

转载 ReactJS 傻瓜教程

著作权归作者所有。 商业转载请联系作者获得授权,非商业转载请注明出处。 作者:范洪春 链接:http://zhuanlan.zhihu.com/FrontendMagazine/19896745 来源:知乎 在相当长的一段时间内,我很努力地去尝试理解 React 是什么以及它在应用架...

2015-11-09 21:00:43 606 0

转载 css中position属性(absolute|relative|static|fixed)

我们先来看看CSS3 Api中对position属性的相关定义: static:无特殊定位,对象遵循正常文档流。top,right,bottom,left等属性不会被应用。 relative:对象遵循正常文档流,但将依据top,right,bottom,left等属性在正常文档流中偏移位置。...

2015-11-08 13:20:00 332 0

原创 更深入学习js的一些细节记录(看到哪里先记录到哪)

javascript学习笔记,学习总结

2015-09-14 14:23:57 425 0

转载 前端性能优化的14个规则

作为一个半前端工程师,而且只会写点HTML5和CSS3的“假”前端工程师,为了能更好地理解一下前端的花花世界,最近拜读了《高性能网站建设指南》一书,对作者提出的前端性能优化的14个规则获益匪浅,为了让自己印象更深刻点,决定作此文,当做学习笔记也好,知识总结也罢,总归看过的东西要让自己很好地掌握很好...

2015-09-07 12:30:34 389 0

原创 总结一些常见web前端面试题

1.js中apply和call的作用和区别是什么? ①主要作用其实就是改变了函数运行时的上下文,简单来讲就是改变所调用函数this的指向,第一个参数是什么对象,此时this就指向这个对象。当一个object没有某个方法,但是其他的有,我们可以借助call或apply用其它对象的方法来操作。 ②二...

2015-08-24 10:19:22 802 0

转载 CSS hack方式一览

做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况。基于此,某些情况我们会极不情愿的使用这个不太友好的方式来达到大家要求的页面表现。我个人是不太推荐使用hack的,要知道一名好的前端,要尽可能不使用hack的情况下实现需求,做到较好的用户体验。可是啊,现实太残酷,浏览...

2015-08-21 10:00:01 302 0

转载 javascript逻辑运算符“||”和“&&”

一、先来说说||(逻辑或),从字面上来说,只有前后都是false的时候才返回false,否则返回true。 alert(true||false); // truealert(false||true); // truealert(true||true); // tru...

2015-08-21 09:11:55 301 0

转载 DOM事件简介

Click、touch、load、drag、change、input、error、risize — 这些都是冗长的DOM(文档对象模型)事件列表的一部分。事件可以在文档(Document)结构的任何部分被触发,触发者可以是用户操作,也可以是浏览器本身。事件并不是只是在一处被触发和终止;他们在整个d...

2015-08-20 15:12:49 722 0

转载 手机分辨率和webapp分辨率的关系

进行移动web开发已经有一年多的时间了,期间遇到了一些令人很困惑的东西。比如: 我们经常使用的里的viewport究竟是什么意思,这里的device-width跟我们用JS获取到的屏宽的区别与联系分别是什么,为什么去掉标签后页面会变得很小很小?为什么很多分辨率很大的屏幕宽度其实并不大,屏幕分...

2015-07-17 11:38:48 7668 0

转载 Hybrid App开发 四大主流移平台分析

Hybrid App开发 四大主流移平台分析   Hybrid App在过去的两年中已经成为移动界的核心话题,但是作为一名Web开发者来说要如何站在移动互联网的浪潮之巅呢?是选择学习原生开发,研究Java、Object-C、C#等语言,还是选择继续使用网页开发,容忍HTML5功能的局限...

2015-05-13 22:54:25 777 0

转载 Angular JS + Express JS入门搭建网站

3月份开始,接到了新的任务,跟UI开发有关,用的是Angular JS,Express JS等技术。于是周末顺便学习下新技术。   组里产品UI架构如下:     其中前端,主要使用Angular JS框架,另外配合Bootstrap提供的很多控件以及JQuery,后台主...

2015-05-13 22:54:18 408 0

原创 一些前端库的收藏

:1:Textillate.js – 实现动感的 CSS3 文本动画的简单插件        官网:http://jschr.github.io/textillate/

2015-05-07 21:49:56 383 0

原创 css3 做成的音频波动效果

音频波效果 #container{ position:relative; } #container span{ width:5px; ...

2015-04-28 12:04:34 9156 0

转载 CSS3 Transitions, Transforms和Animation使用简介与应用展示

一、前言兼目录索引 《天龙八部》里的虚竹小和尚之前可以说是和尚的先进人物与代表模范,各类清规戒律谨记与严守。但是,后来呢,花姑娘送到跟前,什么戒律都成了浮云,禁不住诱惑享乐去了。啊,我现在似乎有类似的感觉,本来不打算深究CSS3的一些属性的,但是其效果以及实际应用价值之诱惑实在巨大,还是抵挡...

2015-04-23 15:14:43 509 0

转载 XMLHttpRequest对象

写在前面的话: 浏览器大战使得浏览器之间的标准无法统一,直接导致了我们在做Web应用系统时,不得不考虑多种兼容方案,创建XMLHttpRequest对象即是如此. 创建XMLHttpRequest对象 1.创建新的XMLHttpRequest对象 script ...

2015-03-31 15:50:44 318 0

提示
确定要删除当前文章?
取消 删除