V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
chenyutian0510
V2EX  ›  React

「react-rainie-router」轻量的移动端 react 路由,只有 2k!

  •  
  •   chenyutian0510 · 2016-09-07 19:01:35 +08:00 · 1863 次点击
    这是一个创建于 3000 天前的主题,其中的信息可能已经有所发展或是发生改变。

    官方的 react-router 打包后有 100 多 k ,移动端上相当影响首屏速度,这里有一个功能相当的 react 路由,只要 2k !!!

    分享给大家,欢迎 star ,欢迎试用,优化性能! 这里分享给大家:

    image

    开发目的

    最近在做公司的 CQASO 移动端项目,用的 react+redux 。 spa 单页用 react-router 路由实现导航。每个页面单独请求(coding-split)后,公共模块的 js 大小为 120k(gzip 压缩后),加上分离出来的单个页面的大小,导致首屏的渲染响应速度极低。为了提高首屏的响应速度,减小 bundle 的大小,我放弃了 100 多 k 的 react-router ,自己写了一套功能, api 一样的路由。

    简单介绍

    react-rainie-router 有如下特点:

    • 它压缩后只有 2k 的大小。
    • 它包含了 react-router 的大部分功能。包括 Router,Route,Link 组件,路由的嵌套,动态路由,默认路由
    • 支持coding-spliting,在 Route 的 getComponent 属性中设置。
    • 可以不依赖 history ,使用 html5 的 history API 。
    • 通过 listenBofore 函数可添加路由过渡动画的逻辑等。

    image

    优化后可减小, gizp 后可减少 15k 的大小。

    目前尚无回复
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   5669 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 137ms · UTC 06:47 · PVG 14:47 · LAX 22:47 · JFK 01:47
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.