learn-tech/16如何实现一个WebAssembly在线多媒体处理应用（二）？.md at 4882464c372b21f19040738cb949e6594d397450

Files

张乾 206fad82a2 first commit

2024-10-16 06:37:41 +08:00

18 KiB

Raw Blame History

                        因收到Google相关通知，网站将会择期关闭。相关通知内容
                        
                        
                        16 如何实现一个 WebAssembly 在线多媒体处理应用（二）？
                        你好，我是于航。

在上一节课中，我们介绍了本次实践项目在代码层面的大体组成结构，着重给你讲解了需要了解的一些基础性知识，比如“滤镜的基本原理及实现方法”以及“Emscripten 的基本用法”等等。而在这节课中，我们将继续构建这个基于 Wasm 实现的多媒体 Web 应用。

HTML

首先，我们来构建这个 Web 应用所对应的 HTML 部分。这部分代码如下所示：

<html lang="en"> <head> <style> * { font-family: "Arial,sans-serif"; } .fps-num { font-size: 50px; } .video { display: none; } .operation { margin: 20px; } button { width: 150px; height: 30px; margin-top: 10px; border: solid 1px #999; font-size: 13px; font-weight: bold; } .radio-text { font-size: 13px; } </style> </head>

帧率：NaN FPS

不开启渲染.
使用 [JavaScript] 渲染.
使用 [WebAssembly] 渲染.
确认

18 KiB Raw Blame History Unescape Escape

帧率：NaN FPS

18 KiB

Raw Blame History