Flutter中提供了两种不同的渲染器来运行和构建Web应用，分别是html渲染器和CanvasKit渲染器。
- HTML渲染器
- 由于浏览器有一套自身的布局标准(html+css)，Flutter在生成Web应用时可以编译为符合浏览器标准的文件，包括使用HTML、CSS，Canvas和SVG元素来渲染。
- 使用Html渲染器的优点是应用体积相对小，缺点是使用Html渲染器时大多数UI并不是Flutter引擎绘制的，所以可能会存在跨浏览器时UI出现不一致的情况。
- CanvasKit浏览器
Flutter的优势是提供一套自绘的UI框架，可以保证多端UI的一致性，Flutter在支持其他平台时，都是将引擎的C++代码编译为相应平台的代码来实现移植的(运行在操作系统之上)。但是在Web平台，Web应用是运行在浏览器之上，而现在浏览器都实现了对WebAssembly的支持，简单来讲，在之前W3C规范中只要浏览器能够支持JavaScript语言，这样的话很多其他语言的代码想要在浏览器中运行就必须改写为JavaScript，而WebAssembly是一种标准的、可移植的二进制文件格式规范，文件扩展名为.wasm，现在的浏览器都支持，也就意味着其他语言按照WebAssembly规范编译的应用可以在浏览器中运行。因此，Flutter将引擎编译成WebAssembly格式，并使用WebGL渲染，这种渲染方式的渲染器，官方称为CanvasKit渲染器。
CanvasKit优点是可以保证跨端UI绘制的一致性，有更好的性能，以及降低不同浏览器渲染效果不一致的风险，缺点是应用大小会增加大约2MB。
在浏览器中运行
命令行参数 --web-render 可选参数为 auto、html或canvaskti。
- auto 默认-自动选择渲染器。移动端浏览器选择HTML，桌面浏览器选择CanvasKit
- html -强制使用Html渲染器
- canvaskit -强制使用CanvasKit渲染器
此选项适用于run和build命令
flutter run -d chrome --web-renderer html
flutter build web --web-renderer canvaskit
Flutter Web使用场景
Web开发已有完整且强大的开发及生态体系，Flutter Web并不适用于Web开发的所有场景，目前Flutter web主要关注以下三个应用场景：
- 渐进式Web应用（Progressive web apps， PWA）。
- 单页应用（Single page apps，SPA），一般一个应用只有一个Html文件，只需一次加载，后续与服务端动态互传数据
- 将现有Flutter移动应用扩展到web，在两个平台共享代码。
注意：PWA和SPA应用在Web开发者是两种基本的应用类型，Web开发者会比较熟悉。
现阶段，Flutter对于富文本和瀑布流类型的Web页面并不是很适合，比如博客，他是典型的以文档为中心的模式，而不是像Flutter这样的UI框架可以提供以应用为中心的服务。以文档为中心的应用通常各个页面之间相互独立，很少有关联，也就不需要跨页面的状态共享，而以应用为中心的服务，通常各个页面之间是有状态关联，不同页面组成一个完整的功能。
