关注IMWeb前端社区公众号

  • 第一时间获得最新、最火的技术干货
  • 定期推送您所关注的专题文章
  • 和大牛们一起讨论前端技术
  • 获取IMWeb社区、前端相关的最新活动
热文 更多

  • Parcel Vs Webpack

    爱折腾的前端圈时常会有新轮子诞生,只要是好东西就能快速获得大量关注,资历再好的大哥只要不如新人也很快会被替代。 横空出世的 Parcel [https://parceljs.org/] 近日成为了前端圈的又一大热点,在短短几周内就获得了13K的Star。 作为前端构建工具新人的Parcel为什么能在短期内获得这么多赞同?他和老大哥Webpack比起来到底有什么优势呢? 我花了6个月的时间写了一本全面介绍Webpack的图书 《深入浅出 Webpack》 [http://webpack.wuhaolin.cn/] 近日刚出版,感觉被新出的Parcel给腰斩了。 但本文将本着公平公正的心态来详细对比一下他两,让你能明白他们直接的异同和优缺点对比,好决定是选Parcel还是Webpack。 为了对比他两,我们从实际出发举一个实战项目为例子,分别用Parcel和Webpack去实现,实战项目要求如下: * 项目采用TypeScript+React+SCSS;

  • 简单粗暴的移动端适配方案 - REM

    目录 * 0.前言 * 1.老版常规做法 * 2.rem * 3.rem计算 * 4.rem存在的问题 * 5.工程应用 0. 前言 手机市场日渐丰富的同时,给我们前端开发人员带来的 网页内容自适应屏幕尺寸进行显示 的问题也日渐凸显出来。原本可能通过百分比/媒体查询等简单手段就可以常见的适配问题,但是对于 页面有复杂结构或者视觉上有特殊要求 的,就需要通过其他手段来解决了。 [http://7tszky.com1.z0.glb.clouddn.com/FiITeMTD1_Eqv-a38EuyPNswj-cS] 以上图类“纪念碑谷”效果为例: 当你的 页面素材都是单独的图片资源 时,你完全可以通过百分比计算出每个动态小人的大小/位置/动画距离等信息;但是 当所有的小图都被拼接成一张大的雪碧图 时,当时我就眉头一皱,事情没有这么简单,元芳不知道你怎么看。 1. 老版常规做法 1.1 VIEWPORT缩放 以最小的Iphone4/5的宽度(320px)为基准,还原视觉稿。

  • mapStateToProps,mapDispatchToProps的使用姿势

    前言 刚接触redux的时候,发现大家对mapDispatchToProps使用有几种方法,而且都跑通了,本文来介绍下, redux 的 mapStateToProps , mapDispatchToProps 的一些使用小姿势。 MAPSTATETOPROPS(STATE, OWNPROPS) 1. mapStateToProps 是一个函数,用于建立组件跟 store 的 state 的映射关系 2. 作为一个函数,它可以传入两个参数,结果一定要返回一个 object 3. 传入 mapStateToProps 之后,会订阅 store 的状态改变,在每次 store 的 state 发生变化的时候,都会被调用 4. ownProps 代表组件本身的props,如果写了第二个参数 ownProps ,那么当 prop 发生变化的时候, mapStateToProps 也会被调用。例如,当 props 接收到来自父组件一个小小的改动,那么你所使用的 ownProps 参数, mapStateToProps 都会被重新计算)。

  • 给 Number 打 Call

    最近“打 call”这个词突然流行起来,我想到 call 在 JavaScript中可是个重要的方法,那么能不能用 JavaScript也来玩一把打 call 呢?于是我在 Number 上实验了下,写出来的代码让我自己都一脸懵逼了,大家能猜到下面这段代码的输出结果吗? Number.call(Number, 1, 2, 3); Number.call.call(Number, 1, 2, 3); Number.call.call.call(Number, 1, 2, 3); Number.call === Number.call.call; Number.call === Number.call.call.call; 结果初探 打 call 的结果 [https://ww2.sinaimg.cn/large/0060lm7Tly1fn3lud9mgyj30i80aegnn.jpg] 不知道大家有没有猜中运行结果呢?反正我看到这个结果的时候是崩溃的(内心活动:为什么相等的三个函数,对相同的参数,返回的结果却不一样??不愧是

  • 新人如何搭建(copy)一个属于自己的博客

    对于很多刚学前端的朋友们来说(比如我),在学习的过程中经常会记一些笔记,除了现实中的烂笔头,我们也可以在PC上记笔记、写总结,下面分享一些或多或少会用上的网站或工具。 脑图类: Xmind [https://www.xmind.cn/] 、 百度脑图 [http://naotu.baidu.com/] ... 总结类: CSDN [https://www.csdn.net/] 、 简书 [https://www.jianshu.com/] 、 segmentfault [https://segmentfault.com/] 、 博客园 [https://www.cnblogs.com/] ... 当然,也有不少朋友们想拥有一个属于自己的博客,学会走路再学跑步,下面将简单暴力的教你搭建(拷贝)一个博客。我们的准备如下 * 拥有一个自己的域名 * 拥有 Git [https://git-scm.com/book/zh/v1/] 基础知识(不懂没关系,跟着大伙走,学会Github即可) * 拥有一个 GitHub [https://github.com/] 账号

热问 更多

  • 赵鹏帆 2017-11-23 10:43

    如题:参考https://twitter.com/necolas/status/829128165314306048?utm_source=feweekly&utm_campaign=issue42&utm_medium=web PWA(做离线化的)目前有这么成熟吗? 这个是否也说明以Javascript为基础的全栈体系正在逐渐落地?

  • 大漠刀客 2018-01-13 17:42

    js高级程序设计里说 this 引用的是函数执行的环境对象, 下面foo()在window下执行,环境对象就是window? * function foo(){ * alert(this); * } * foo(); * 那么函数嵌套为什么也是[object Window]?比如下面的 * function foo(){ * function foo2(){ * alert(this); * } * foo2(); * } * foo(); 输出的还是window * function SpecialArray(){ * alert(this); * } * alert(this); * SpecialArray(); * var colors = new SpecialArray(); 弹出的依次是[object Window],[object Window],[object Object]?这里的Object又是什么情况

  • 络黎 2017-10-19 17:31

    请指出JavaScript宿主对象和原生对象的区别?