文档章节

  fis能够做什么

欢乐小金鱼
 欢乐小金鱼
发布于 2015/04/06 14:01
字数 1662
阅读 44
收藏 0
点赞 0
评论 0

最近一直在学习fis,开始并不知道fis在做什么,理解的很模糊,所以一直在学习中。。。下面来写下我自己的理解。

首先介绍下:前端模块化开发体系是什么样的:

前端模块化开发体系

在开发目录中的什么文件,将来要部署到什么集群上,框架中要做哪些处理” 这样的事情,也就是连接开发规范、部署规范和模块化框架的工作。三者是需要工具进行转换的

要实现一个完整的模块化开发体系,我觉得需要有一个工具做这些事情:

  1. 对模块化资源进行扫描,获取资源依赖关系,生成依赖表,注入到模块化框架中供依赖管理、按需加载、合并请求等优化使用(资源依赖,用于连接框架)

  2. 接收一种配置,标记每种类型的文件会发布到什么目录或集群中,然后扫描所有文件中的资源定位标记,将其替换成部署路径(资源定位,用于连接开发和部署规范)

  3. 允许一些资源并不是通过模块化方式加载,而是直接内嵌到其他资源中使用,比如把图片以base64形式嵌入到css、js中(资源内嵌,非必须,但很有用)


以上三件事并不是一件简单的工作,下面就图解一下这几件事情

1.所谓工具连接框架

工具连接框架

连接框架 就是工具把静态分析的依赖关系以某种形式传递给框架,用于框架在运行时的资源管理、加载及优化

2.所谓工具连接规范(连接的是开发规范和部署规范)

工具连接规范

给一个配置文件,告诉工具,源码中的什么文件(用reg匹配)部署后会发布到哪里(release定义),这样,工具会把源码中所有关于这个资源的定位标记替换成部署路径。实现开发时使用工程路径,构建后使用部署路径的功能。这个功能可以保证资源的独立性,并且能对性能做优化(加md5戳)。独立性可以让资源无论是被合并、移位还是在其他地方加载都能正常运行。


下面解释下fis能够做什么

前端架构大部分工作要解决的是 如何用工具连接框架和规范的问题。这是一个工程问题。fis想解决的正是规范与框架的链接问题,而不是简单的前端源码构建。

所谓框架,主要指模块化框架,其职责包括对模块化资源的管理和加载,管理包括js/css的依赖管理,加载包括按需加载和请求合并,以及资源缓存与更新。

所谓规范,主要是指开发和部署规范,比如哪些是模块化资源,哪些是非模块化资源,模块化资源如何包装、优化和部署,非模块化资源如何部署等,什么文件发布到什么目录,是否有CDN等等。

框架、规范、工具三者需要紧密配合才能比较完美的解决模块化开发、性能优化等前端工程问题。

fis本身是一种特殊的 “工具”,通过一些比较 “奇怪” 的配置设计,实现了框架与规范的绑定过程。这些问题我觉得是grunt/gulp不曾思考过的。

fis的解决方案,包括你看到的rsd,还有 scrat,其实都是对fis的配置,每一套配置用于连接一种特定的规范和框架:

  • fis-plus:以smarty为模板引擎,以 mod 为模块化框架,适用于php后端渲染及部署运维方式的解决方案。

  • yogurt:以swig为模板引擎,以 mod 为模块化框架,适用于nodejs后端渲染架构及部署运维方式的解决方案

  • jello:以velocity为模板引擎,以 mod 为模块化框架,适用于java后端渲染架构及部署运维方式的解决方案

  • pure:无后端渲染,使用前端模板,以 mod 为模块化框架,适用于纯前端,前后端严格分类的项目

  • gois:go语言解决方案。

  • spmx:纯前端方案,以seajs为模块化框架,一个示例项目,不完整,不要用于生产

  • rsd:纯粹是为了展示静态资源md5问题的项目,把fis所有的语言插件都装上,可以在一个项目里混合多种语言进行开发,用资源内嵌实现打包,可以认为是最简易的fis,不适合大规模生产。

  • scrat:以 scrat.js 为模块化框架,内含webapp、seo、olpm三种模式,其中:

    • webapp是纯前端解决方案,依赖combo服务实现资源合并,适用于中型移动端单页面应用.

    • seo是多页面模式,以swig为模板引擎,进行后端渲染,支持quickling(或者pjax),以combo服务合并资源,面向需要seo的单页面应用.

    • olpm是运营后台模板开发模式,我们内部有一个CMS,可以用这种模式进行开发,本地预览,然后把代码打包上传到cms系统,作为专题模板使用。

    总之,由于前端的开发环境、开发模式、部署方式实在是太五花八门了,有传统多页面模式,有移动端SPA模式,有CMS组件化拼装模式,不同的模式还可能会结合不同的后端语言(不要以为前端可以完全从后端剥离出来,不理解其中的原理,我可以单独写一篇文章说明),所以不可能有一种固定模式能解决所有问题,fis的设计就是把所有这些模式中的公共部分抽取出来形成一个基础工具,面对不同开发部署规范、不同模块化框架再做配置即可。

    所有不同的前端开发模式,有一些相同的内在联系,那就是:资源定位资源内嵌资源依赖这三种语言能力。这三种语言能力为什么会成为所有开发模式的共性,这和前端这种特殊的GUI软件的安装和运行方式有关,后面再另开文章讲解吧,这里就不再解释了。




© 著作权归作者所有

共有 人打赏支持
欢乐小金鱼
粉丝 9
博文 14
码字总数 6977
作品 0
海淀
程序员
jQuery对象入门级介绍

本文由伯乐在线 -kmokidd 翻译。未经许可,禁止转载! 英文出处:smashingmagazine。欢迎加入翻译组。 你是否曾经见过像 这样的JavaScrip代码?或许你还会思考下 是什么,如果看到这些你都觉...

伯乐在线 ⋅ 2014/06/24 ⋅ 0

如何利用 C++ 的 Lambda 表达式提升 Qt 代码

原文出处:oschina Lambda 表达式是在 C++11 中加入的 C++ 特性。在这篇文章中我们将看到如何用 Lambda 表达式来简化 Qt 代码。Lambda 很强大,但也要小心它带来的陷阱。 首先,什么是 Labm...

oschina ⋅ 2017/02/09 ⋅ 0

如何处理前任程序员留下的代码

原文出处:Justin Albano 译文出处:开源中国 身为一个软件工程师,我们不可避免的会遇到这样一些问题:不得不修改别人的代码,或者在别人的代码中添加新的功能。我们并不熟悉这些代码,它也...

Justin Albano ⋅ 2017/11/28 ⋅ 0

提升网站访问速度的 SQL 查询优化技巧

原文出处:Delicious Brains 译文出处:开源中国 你一定知道,一个快速访问的网站能让用户喜欢,可以帮助网站从Google 上提高排名,可以帮助网站增加转化率。如果你看过网站性能优化方面的文...

Delicious Brains ⋅ 2017/12/09 ⋅ 0

AngularJS 中的一些坑

本文由伯乐在线 -蔡蔡 翻译。未经许可,禁止转载! 英文出处:branchandbound。欢迎加入翻译组。 最近几个月频繁的跟AngularJS打交道,对于web应用开发来说Angular真的是一个神奇的框架,但是...

伯乐在线 ⋅ 2013/12/07 ⋅ 0

性能测试的艺术

原文出处:磁针石 为什么要进行性能测试? 什么是好的与坏的性能?为什么性能测试在软件开发生命周期(SDLC software development life cycle)中很重要? 性能不佳的应用通常无法实现企业预期...

磁针石 ⋅ 2016/03/21 ⋅ 0

Nginx 教程 (1):基本概念

原文出处:netguru 译文出处:开源中国 简介 嗨!分享就是关心!所以,我们愿意再跟你分享一点点知识。我们准备了这个划分为三节的《Nginx教程》。如果你对 Nginx 已经有所了解,或者你希望了...

netguru ⋅ 01/28 ⋅ 0

每天一个 Linux 命令(58): telnet 命令

原文出处:peida telnet命令通常用来远程登录。telnet程序是基于TELNET协议的远程登录客户端程序。Telnet协议是TCP/IP协议族中的一员,是Internet远程登陆服务的标准协议和主要方式。它为用户...

peida ⋅ 2017/02/05 ⋅ 0

为什么面向对象编程是有用的?(以一个角色扮演游戏为例)

本文由伯乐在线 -Janzou 翻译,艾凌风 校稿。未经许可,禁止转载! 英文出处:inventwithpython。欢迎加入翻译组。 本文面向的是那些刚刚接触编程,可能已经听说过”面向对象编程”,”OOP”...

伯乐在线 ⋅ 2014/12/31 ⋅ 0

每天一个 Linux 命令(57): ss 命令

原文出处:peida ss是Socket Statistics的缩写。顾名思义,ss命令可以用来获取socket统计信息,它可以显示和netstat类似的内容。但ss的优势在于它能够显示更多更详细的有关TCP和连接状态的信...

peida ⋅ 2017/02/04 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

思路分析 如何通过反射 给 bean entity 对象 的List 集合属性赋值?

其实 这块 大家 去 看 springmvc 源码 肯定可以找到实现办法。 因为 spirngmvc 的方法 是可以 为 对象 参数里面的 list 属性赋值的。 我也没有看 具体的 mvc 源码实现,我这里只是 写一个 简...

之渊 ⋅ 29分钟前 ⋅ 0

vim使用手册--配对括号的查找

1、把光标放在标记有(、[或{处。 2、按%字符 3、此时光标的位置应当在配对的括号处 4、再次按%就可以跳回配对的第一个括号处。

dragon_tech ⋅ 33分钟前 ⋅ 0

c++ 、object-c printf,%02X和%x有什么区别 ?

%x即按十六进制输出,英文字母小写,右对齐。 %02X有以下变化:英文字母变大写,如果输出字符不足两位的,输出两位宽度,右对齐,空的一位补0。超过两位的,全部输出。 如果不用 %02x 会出现...

yizhichao ⋅ 38分钟前 ⋅ 0

Spring源码解析(七)——实例创建(中)

前言 上一节讲到了,Spring 会根据实例的作用域执行不同的创建逻辑,分别是 Singleton、Prototype、其他 Scope,其中 Singleton 会调用 getSingleton 从缓存中获取,缓存中没有才会创建实例;...

MarvelCode ⋅ 38分钟前 ⋅ 0

Thrift RPC实战(六) spring集成thrift

1.服务端设置 对泛型Thrift Service的支持, 通过采用spring配置以及反射的方式来实现.对于一个服务提供者来说,需要提供端口,接口以及接口实现类,因此在接口中spring配置文件中配置如下 <!...

lemonLove ⋅ 41分钟前 ⋅ 0

oracle11g自动分区使用

为什么使用自动分区? 在oracle11g之前,oracle是不支持自动分区功能的,这就可能导致我们系统在运行一段时间之后,就需要看看分区是否创建或者写触发器进行创建分区,否则就会导致数据无法入...

strict_nerd ⋅ 52分钟前 ⋅ 0

Spring mvc ViewResolver视图解析器实现机制

概要 我们在controller里面经常这样return一个ModelAndView。 return new ModelAndView("userList", "users", userList); DispatcherServlet 靠 ViewResolver 把 userList 解析为 /WEB-INF......

轨迹_ ⋅ 今天 ⋅ 0

策略模式

1.策略模式 策略模式是同一个行为的不同处理办法。策略模式和简单工厂模式的区别:1.策略模式主要是方法的执行方式,工厂模式要获取的对象。两者的侧重点不同。 ...

Cobbage ⋅ 今天 ⋅ 0

行政区划代码转为字典形式

原数据为: http://www.mca.gov.cn/article/sj/xzqh/2018/201804-12/201804-06041553.html 手动替换了一下格式,并使用下面的代码处理. # 输入格式s = """110000:北京市110101:东城区1101...

漫步海边小路 ⋅ 今天 ⋅ 0

android apk 签名

创建key,需要用到keytool.exe (位于C:\Program Files\Java\jdk1.6.0_10\bin目录下),使用产生的key对apk签名用到的是jarsigner.exe (位于C:\Program Files\Java\jdk1.6.0_10\bin目录下),把...

国仔饼 ⋅ 今天 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部