2018年04月_Geek技术前线

原创深入Preact源码分析（五）非组件类型的diff解析

非组件节点的diff分析diff的流程，我们从简单到复杂进行分析通过前面几篇文章的源码阅读，我们也大概清楚了diff函数参数的定义和component各参数的作用/** * @param dom 初次渲染是undefinde，第二次起是指当前vnode前一次渲染出的真实dom * @param vnode vnode，需要和dom进行比较 * @param context 类...

2018-04-20 16:45:23 442

原创深入Preact源码分析（四）setState发生了什么

setState发生了什么setState(state, callback) { let s = this.state; if (!this.prevState) this.prevState = extend({}, s); extend(s, typeof state==='function' ? state(s, this.props) : state);//...

2018-04-17 21:12:04 1127

原创深入Preact源码分析（三）Preact组件实例到DOM的过程

紧接上节，Preact组件从vnode到真实html的过程发生了什么？...// buildComponentFromVNode方法内部// buildComponentFromVNode(undefined, vnode, {}, false);c = createComponent(vnode.nodeName, props, context);// 创建组件setCo...

2018-04-17 21:06:01 664

原创深入Preact源码分析（二）virtualDOM如何变为真实dom

一个简单的Preact代码如下// 一个简单的Preact demoimport { h, render, Component } from 'preact';class Clock extends Component { render() { let time = new Date().toLocaleTimeString(); return &...

2018-04-17 21:04:30 912

原创深入Preact源码（一）jsx要转化成virtualDOM发生了什么

本文和自己在掘金的同步jsx要转化成virtualDOM，首先经过babel，再经过h函数的调用形成virtualDOM。具体如下源码链接 ./src/h.js相当于react得createElement()，jsx经过babel转码后是h的循环调用，生成virtualDOM。// jsx<div><span className="sss" fpp="xxx...

2018-04-17 20:59:46 447

原创 webpack4学习+配置实现简单的多页面jq开发脚手架

wepack4搭建多页面脚手架学习前言：以前刚接触webpack的时候还是1，当时大概过了下文档操作了一下当时写的一些注释。后来开发的时候基本写react都是用的create-react-app或者找别人的搭好的脚手架用。所以趁着找到实习后的间隙加上webpack4刚出也不算久，重新学习加复习下webpack的一些知识。本文仓库。仍在更新和学习摸索中tips: - extract-t...

2018-04-12 16:14:01 3750

原创 18前端实习面经+offer

某厂3.16 晚上电话一面（50分钟）问题描述下原型链js作用域闭包垃圾回收如何读取对象属性不在原型链上找cookie一些属性浏览器缓存http和https协议同源策略、跨域解决办法web安全XSS CSRF怎样产生、如何防范。具体转义哪些字符你觉得的自己优点和缺点平时怎么学前端一小时后电话二面并约了写代码（28分钟）讲项目和遇到的难点imutable.j...

2018-04-11 21:55:12 3404

原创微信小程序踩坑记录

某个元素如果设置fixed。在某些ios机型某系统下，会fixed不正常显示。似乎不是相对于视窗定位。解决办法：把这个东西放在wxml顺序的最顶部在某些ios机型某系统下。某个元素在flex布局中,flex子元素设置absolute会导致这个子元素不受flex容器控制其它待补充。。。...

2018-04-09 15:43:23 247

flytam的博客