关注IMWeb前端社区公众号

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

  • @ts-check

    由于 JavsScript是弱类型,所以在大型项目中使用时显得能力略有不足。从七月份在腾讯实习到现在,接触到了不少项目的代码,平均算来每天都有 70% 的时间用于阅读、理解他人的代码。每次阅读他人代码的时候,我心中都会冒出来两个强烈的愿望:要是 JavaScript是强类型的多好!要是文档能再详细一点就好了!多亏了 TypeScript和 JSDoc,这两个愿望都有变成现实的可能。 @TS-CHECK 立即上手 使用 TypeScript的最佳方式肯定是直接使用它的语法来编写 .ts 文件,然后通过编译器转换成 .js 文件。然而对于老项目而言,切换构建往往意味着麻烦和巨大的风险,而且假如将来 JavaScript也引入了类型系统(这非常有可能),那又得从 TypeScript切回 JavaScript(回归标准)。那么有没有一种无痛的方式,让我们既可以享受 TypeScript带来的好处,又能不改变项目的现有构建方式呢? 答案就是 // @ts-check ,在 .js 文件的头部引入这样一行注释,就可以使用 TypeScript了。

  • vue2.x-仿懂球帝SPA-爆炸足球

    vue2.x—爆炸足球 模仿懂球帝移动端,欢迎各位童鞋star github地址: https://github.com/vqlai/vue2-football [https://github.com/vqlai/vue2-football] 技术栈 前端 es6 vue2.x vue-router2 axios better-scroll vue-lazyload stylus 后端 通过webpack 设置HTTP代理的方式请求懂球帝官网api获取数据 项目截图 [http://7tszky.com1.z0.glb.clouddn.com/Frhrryixz536bUwewWp1JrSVD7wD] [http://7tszky.com1.z0.glb.clouddn.com/FpFcpCHcaEc48kyg_FypTxn6JzWR] [http://7tszky.com1.z0.glb.clouddn.com/FsqZCNAttlloer5oL3hnI8OLtvhe]

  • React16中的服务端渲染(译)

    React 16发布了。 React 16有很多令人兴奋的新东西(尤其是Fiber),而且React 16对服务器端渲染所做了许多改进,让我们深入剖析React16的服务端渲染有什么不一样。 REACT 15 SSR是如何工作的 首先,我们先回顾一下React 15的服务端渲染,为了实现SSR,你可能会用nodejs框架(Express、Hapi、Koa)来启动一个web服务器,接着调用 renderToString 方法去渲染你的根组件成为字符串,最后你再输出到 response。 // using Expressimport { renderToString } from"react-dom/server"import MyPage from"./MyPage" app.get("/", (req, res) => { res.write("<!DOCTYPE html><html><head><title>My Page</title></head><body>"); res.write("<div id='content'>");

  • ES6 + Babel + React低版本浏览器采坑记录

    有个项目要兼容IE8-10 某天,胆大的某前端开发由于业务需要升级了项目依赖 IMUI [http://imweb.github.io/imui/] ,升级了项目构建( babel 5.x => babel 6.x ),于是...这个页面在IE下就白屏了。忙乎了一天加班到深夜,觉得实在是坑多,这里记录一下。 坑越来越深 经过分析,主要有这么几个兼容性问题: REACT/REACT-DOM依赖版本问题 这点比较好解决,将react的版本降至 0.14.x 即可,然后将imui中用到新特性的组件代码给删除(比如 PureComponent )。 对象不支持 XXX 属性或方法 这种情况一般是使用了es6,es7的高级语法,解决方案有很多种: * 局部引入额外的库 import assign from 'object-assign' * 全局引入polyfill(会污染全局,例如 babel-polyfill ) * 使用 babel-plugin-transform-runtime 这里就不详细说了,大家可以使用 corejs 方案,支持局部使用和全局实现。

  • React性能优化

    REACT性能优化 单个REACT组件的性能优化 SHOULDCOMPONENTUPDATE React利用Virtual DOM来提高渲染性能,但是Virtual DOM计算前后的区别仍然需要消耗时间。如果我们已经提前知道一个组件不应该更新,那么直接通过shouldComponentUpdate函数返回false,组件则不会进行接下来的update操作,也就不需要进行Virtual DOM的计算,可以节省很长的时间。 但是,做这种优化本来就需要额外的时间成本,那我们应该如果去决定做哪些组件的优化呢?一个是使用React Perf插件来进行组件的性能测量,找到性能瓶颈,另外一个就是对一些用的很多的组件进行性能优化,如果长列表的每个子组件等。 PURERENDER pure render的实现是重写shouldComponentUpdate函数。引入pure render后,组件在调用shouldComponentUpdate函数时,会对props和state做浅比较,然后根据浅比较结果返回true或false,决定是否render。pure

热问 更多

  • 赵鹏帆 19 天前

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

  • 大漠刀客 2017-07-16 13:45

    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又是什么情况

  • 络黎 19 天前

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