tessellate Architecture
转自:https://zalando-incubator.github.io/tessellate/
Tessellate consists of two major components: the bundler and the fragment. Together they make it possible to dynamically render HTML based on an abstract JSON definition. This section gives an overview of the two components and how they integrate with the Mosaic project.
tessellate-bundler
The job of the bundler is to prepare JavaScript bundles that the fragment can render to static HTML. Bundles are UMD (universal module definition) modules which export the root component of a React component tree.
The compiled bundles are exported to a configurable location, e.g. a CDN server. A bundle may consist of multiple JavaScript files and additional assets, like CSS and images.
tessellate-fragment
The fragment is responsible for rendering the prepared JavaScript bundles into static HTML using React's server side rendering capabilities. Upon receiving a request, the fragment determines which bundle it needs to fetch and render. Then it responds with static HTML and links to the JavaScript and CSS files of the bundle inside a response header, as defined by the Fragment API.
In addition to the JavaScript bundle a fragment may fetch more data from other sources that can be injected into the rendering process, e.g. properties for the React components or data that React components load themselves upon rendering based on their internal logic.
Mosaic integration
Mosaic is an architecture to enable microservices in the frontend. That is, modular websites composed of smaller, independent parts – Fragments. Tessellate provides a generic solution for dynamic Fragmentswhich can render any content based on an abstract JSON definition. A typical setup includes the following components:
- Tessellate bundler – compiles JavaScript bundles from JSON.
- Tessellate fragment – renders bundles into static HTML.
- Tailor layout service – composes multiple fragments Together.
- Skipper router – routes requests to different layouts.
Please take a look at the Mosaic documentation for more details.
Mosaic does not dictate which frontend technologies to use, however Tessellate requires that the rendered HTML is based on React components. For this reason tessellate-bundler must be able to require the necessary npm modules for the components that are declared inside the abstract JSON definition. The compiled bundles are placed in a public location (e.g. a CDN server) where they can be retrieved from by both the fragment and the browser (for dynamic components). The fragment may also access other additional web services based on the context of each request. For example, the property data to hydrate the React components may be loaded from another service.
Because of its modularity, Mosaic allows composing many different Fragments, not only Tessellate. Although a single Tessellate Fragment could in theory render a complete page, it is more common compose pages of more than one Fragment inside a Tailor layout. See the Tailor documentation for more details.
tessellate Architecture的更多相关文章
- Game Engine Architecture 9
[Game Engine Architecture 9] 1.Formatted Output with OutputDebugString() int VDebugPrintF(const char ...
- Undefined symbols for architecture arm64解决方案
在iOS开发中经常遇到的一个错误是Undefined symbols for architecture arm64,这个错误表示工程某些地方不支持arm64指令集.那我们应该怎么解决这个问题了?我们不 ...
- Optimal Flexible Architecture(最优灵活架构)
来自:Oracle® Database Installation Guide 12_c_ Release 1 (12.1) for Linux Oracle base目录命名规范: /pm/s/u 例 ...
- EF框架组件详述【Entity Framework Architecture】(EF基础系列篇3)
我们来看看EF的框架设计吧: The following figure shows the overall architecture of the Entity Framework. Let us n ...
- [Architecture] 系统架构正交分解法
[Architecture] 系统架构正交分解法 前言 随着企业成长,支持企业业务的软件,也会越来越庞大与复杂.当系统复杂到一定程度,开发人员会发现很多系统架构的设计细节,很难有条理.有组织的用一张大 ...
- Stack Overflow: The Architecture - 2016 Edition
To get an idea of what all of this stuff “does,” let me start off with an update on the average day ...
- ios build时,Undefined symbols for architecture xxx问题的总结
简单来说,Undefined symbols基本上等于JAVA的ClassNotFoundException,最常见的原因有这几种: build的时候没有加framework 比如说,有一段代码我用了 ...
- Undefined symbols for architecture x86_64: "_OBJC_CLASS_$_The49DayPersonalFullscreenGiftModel", referenced from: objc-class-ref in The49DayPersonalRoomGiftModel.o ld: symbol(s) not found for a
Undefined symbols for architecture x86_64: "_OBJC_CLASS_$_The49DayPersonalFullscreenGiftModel&q ...
- ios开发错误之: Undefined symbols for architecture x86_64
错误如下: Undefined symbols for architecture x86_64: "_OBJC_CLASS_$_RoutingHTTPServer", refere ...
随机推荐
- Linux学习: 触摸屏驱动
一.Linux输入子系统的结构: 二.触摸屏驱动代码: s3c_ts.c #include <linux/errno.h> #include <linux/kernel.h> ...
- 深入理解java虚拟机---java虚拟机内存管理(六)
java虚拟机栈的理解 虚拟机栈就是我们所熟知的栈内存,栈内存属于线程独有的.而在栈内存中的局部变量表中存储的引用类型只是存储对象的内存地址.对象的创建在堆内存中,即对象在线程共享区中. 局部变量表: ...
- core net 2 nuget的数据源包
基本都是 在 obj里面 debug里面 porgect.assetc.json
- Interlocked单向链式栈
线程同步一大部分与原子访问(atomic access)有关, 所谓原子访问, 指的是一个线程在访问某个资源的同时能够保证没有其他线程会在同一时刻访问同一资源. Interlocked单向链式栈的操作 ...
- μC/OS-II在Microblaze上的移植与使用专题--“安富利杯”赛灵思FPGA设计技巧与应用创新博文大赛参赛作品
reference:http://xilinx.eetrend.com/d6-xilinx/blog/2010-05/682.html 随着集成电路设计与制造技术的发展,FPGA芯片的容量越来越大 ...
- log4net在release模式下无法生成文件或不写入日志
在Debug模式一切正常,但是在release模式下log4net不工作,查了很多资料,终于解决.具体做如下检查修改. 1.检查log4net写入日志文件路径是否正确: 2.检查对应日志文件路径是否有 ...
- centos6.6安装hadoop-2.5.0(四、hadoop HA安装)
操作系统:centos6.6 环境:selinux disabled:iptables off:java 1.8.0_131 安装包:hadoop-2.5.0.tar.gz HA模式下的HADOOP完 ...
- LVS+OSPF+FULLNAT集群架构
OSPF:OSPF(Open Shortest Path First开放式最短路径优先)是一个内部网关协议(Interior Gateway Protocol,简称IGP),用于在单一自治系统(aut ...
- Delphi 10.2.3 新增的TMimeTypes类
Delphi 10.2.3 新增的TMimeTypes类,利用url中的文件扩展名,可以轻松得到url需要返回的HTTP content-type类型,可以参考这里,现在查看AddDefTypes方法 ...
- Buildroot stress-ng Linux系统压力测试
/********************************************************************** * Buildroot stress-ng Linux系 ...