OpenGL ES 抖音“传送带“特效实现终极版

很早之前的 demo 被翻出来了,最近有读者在知识星球上提问关于“传送带”特效性能的优化。

这位读者按照这篇文章抖音传送带特效是怎么实现的? 的思路,实现了“传送带”效果,但是遇到了性能问题。

在优化性能之前先回顾下“传送带”效果的实现原理。

抖音传送带特效原理

通过仔细观察抖音的传送带特效,你可以发现左侧是不停地更新预览画面,右侧看起来就是一小格一小格的竖条状图像区域不断地向右移动,一直移动到右侧边界位置。


预览的时候每次拷贝一小块预览区域的图像送到传送带,这就形成了源源不断地向右传送的效果。

这种实现方式会有什么问题呢?

从上面的文章可以看出,它使用的是 CPU 内存来作为缓存,然后每次绘制之前都需要进行一系列的拷贝,最后再上传数据到纹理。

由于每帧都需要进行拷贝和上传数据的操作,在遇到分辨率比较高的图像时,造成性能和功耗上的开销很大。

优化的思路就是要减少数据拷贝和传输,使用

移动端渲染发热优化:纹理采样与后处理的GPU带宽减负 在移动端渲染中,GPU带宽是决定性能与功耗的核心资源。纹理采样和后处理这两大高频操作,每帧搬运的数据量远超想象。理解纹理压缩格式(如ASTC)与mipmap的工作方式,掌握后处理Pass的降采样与合并技巧,可以显著降低GPU的无效搬运。无论是Unity、UE还是原生Metal/Vulkan,这套思路均适用。从Profiler定位热源,到纹理特征画像,再到动态后处理档位管理,一个完整的优化流程能有效控制设备发热,提升帧率稳定性。复杂场景下,GPU占用率可从80%以上降至50%左右,整机功耗下降约1W。对于面对 阅读详情

相关推荐

OpenGL ES 实现抖音传送带特效

Android 相机出图是 YUV 格式的,这里为了拷贝处理方便,先使用 OpenCV 将 YUV 图像转换为 RGBA 格式,当然为了追求性能直接使用 YUV 格式的图像问题也不大。

字节流动 3万+

OpenGL ES 实现抖音“蓝线挑战”特效

前面文章中我们实现了抖音传送带特效,发现大家普遍对抖音视频特效感兴趣,那么本文将继续这个抖音特效实现系列,后面也将带来更多的关于抖音视频特效分析和实现的文章。本文带给大家的是抖音的经典视频特效“蓝线挑战”实现,为啥选择“蓝线挑战”?之前这个特效没太在意,知道看到老罗直播团队用这个特效拍了一个短视频,发现挺有意思的。之前“蓝线挑战”特效有人实现过它的变种,但是看起来搞的有点复杂了,本文的实现思路就非常简单,抖音“蓝线挑战”和“传送带”实现原理基本相同:每次更新预览帧图像的特定区域进行渲染。抖音“蓝线挑战”特效

字节流动 3万+

OpenGL ES 3.0 从入门到精通系统性学习教程

因为在工作中频繁使用 OpenGL ES 做一些特效、滤镜之类的效果,加上平时学到的的知识点也比较细碎,就想着去系统地学习下 OpenGL ES 相关开发知识,并将学习过程记录下来。

字节流动 3万+

OpenGL ES 3.0 开发(一):绘制一个三角形

该原创文章首发于微信公众号:字节流动 什么是 OpenGLES OpenGLES 全称 OpenGL for Embedded Systems ,是三维图形应用程序接口 OpenGL 的子集,本质上是一个跨编程语言、跨平台的编程接口规范,主要应用于嵌入式设备,如手机、平板等。由科纳斯(Khronos)组织定义和推广,科纳斯是一个图形软硬件行业协会,该协会主要关注图形和多媒体方面的开放标准。 O...

字节流动 8万+

OpenGL ES 如何直接渲染 P010、P016 格式图像?

P010 最早是微软定义的格式,表示的是 YUV 4:2:0 的采样方式,也就是说 P010 表示的是一类 YUV 格式,它的内存排布方式可能是 NV21、NV12、YU12、YV12。P016 也表示的是 YUV 4:2:0 的采样方式,与 P010 的差异只是有效位不同,P010 的有效位是 10bit , P016 有效位为 16bit。,在 Shader 中采样的时候,把 RG 通道当成 v 分量数据,把 BA 通道当成 u 分量数据,分别转成 16bit 数据,然后在进行归一化。

字节流动 5万+

Android OpenGL ES FFmpeg 从入门到精通系统性学习教程

为什么要写这个教程 目前这个 OpenGL ES 极简教程的更新暂时告一段落,说是教程,其实自知有种吹嘘的味道,很荣幸获得了阮一峰老师的推荐。 因为在工作中频繁使用 OpenGL ES 做一些特效、滤镜之类的效果,加上平时学到的的知识点也比较细碎,就想着去系统地学习下 OpenGL ES 相关开发知识,并将学习过程记录下来。 另外,这个 Android OpenGL ES 极简教程也是为音视频开发做准备的,它的内容涵盖了 OpenGL ES 3.0 的核心知识点,包含了 GLES3.0 的新特性,如 Tra

字节流动 5万+

OpenGL ES 渲染 NV21、NV12、I420、YV12、YUYV、UYVY、I444(建议收藏)

本文主要讲解常见的 YUV 格式图像渲染方式,如果对 YUV 格式不是很熟悉的同学可以翻看旧文,YUV 格式的介绍这里不再展开。

字节流动 5万+

Android OpenGL 渲染图像读取哪家强

该原创文章首发于微信公众号:字节流动 glReadPixels glReadPixels 是 OpenGL ES 的 API ,OpenGL ES 2.0 和 3.0 均支持。 使用非常方便,下面一行代码即可搞定,但是效率也是最低的。 glReadPixels(0, 0, outImage.width, outImage.height, GL_RGBA, GL_UNSIGNED_BYTE, buffer); 当调用 glReadPixels 时,首先会影响 CPU 时钟周期,同时 GPU 会等待当前帧.

字节流动 5万+

OpenGL ES (OpenGL) Compute Shader 计算着色器是怎么用的?

OpenGL ES (OpenGL) Compute Shader 是怎么用的?Compute Shader 是 OpenGL ES(以及 OpenGL )中的一种 Shader 程序类型,用于在GPU上执行通用计算任务。与传统的顶点着色器和片段着色器不同,Compute Shader 被设计用于在 GPU 上执行各种通用计算任务,而不是仅仅处理图形渲染。Compute Shader 使用场景广泛,除了图像处理之外,还可以用于物理模拟计算、数据加密解密、机器学习、光线追踪等。

字节流动 5万+

OpenGL 实现“人像背景虚化“效果

手机上的人像模式,也被人们称作“背景虚化”或 ”双摄虚化“ 模式,也称为 Bokeh 模式,能够在保持画面中指定的人或物体清晰的同时,将其他的背景模糊掉。突出画面的主体部分,主观上美感更强烈。,例如美颜、肤色优化以及基于深度信息的虚化等,最终提供清晰突出的人像照片。所以,人像模式的实现对于软件层面来说,关键还是有能精确输出带有深度(景深)信息的图像分割算法。

字节流动 5万+

OpenGL ES 3.0 着色器程序二进制化

之前有位读者提问:C++ 如何将 OpenGL ES 的着色器程序二进制(保存),然后在其他地方加载使用?现在写篇文章介绍下。将着色器程序二进制化(Shader Program Binary)有哪些好处?:使用二进制形式的着色器程序可以更快地加载和解析,因为不需要进行编译和链接的过程。二进制数据可以直接加载到显卡驱动程序中进行处理,节省了编译和链接的时间。:由于二进制形式的着色器程序不包含可读的源代码,因此更难以逆向工程或进行代码分析。。

字节流动 4万+

OpenGL ES 渲染 NV21、NV12 格式图像有哪些“姿势”?

前文提到,分别用于保存 Y plane 和 UV plane 的数据,然后在片段着色器中分别对 2 个纹理进行采样,转换成 RGB 数据。,其中 GL_LUMINANCE 纹理用来加载 NV21 Y Plane 的数据,GL_LUMINANCE_ALPHA 纹理用来加载 UV Plane 的数据。OpenGLES 常用纹理的格式类型GL_LUMINANCE 纹理在着色器中采样的纹理像素格式是(L,L,L,1),L 表示亮度。

字节流动 4万+

2006NOIP普及组真题 4. 数列

从上述推理中,我们发现要输出的幂次和中的第 N 项(也就是幂次和中的序号N),对应的二进制位数和幂次和对应的二进制位数相同。当 k=3 时,k的幂次为1, 3, 9, 27, 81…,即第0位,第2位均为1,转成 k 进制(k=3)时。,即第2位,第3位均为1,转成 k 进制(k=3)时。转成 k 进制(k=3)时的幂次和为。,即第0位,第1位,第2位均为1,(即第0位,第1位,第2位均为1)N=12时,12的二进制是。(即第0位,第2位均为1)(即第2位,第3位均为1)结论:这道题就变成了。

weixin_40252159的博客 1513

SOLIDWORKS转CAD字体终极选择:TrueType vs SHX,哪个才是你图纸协作的“安全牌”?

本文深入探讨SOLIDWORKS转CAD工程图中的字体选择问题,对比TrueType与SHX字体在DWG文件协作中的表现。通过真实案例揭示字体映射的兼容性陷阱,提供企业级字体管理方案,帮助工程师规避版本差异、系统依赖和法律风险,确保图纸协作的稳定性。

weixin_34233974的博客 264

TBtools的序列提取步骤

本教程详细介绍了如何使用TBtools软件从原来的FASTA序列中提取特定的DNA序列。

weixin_47509995的博客 1万+

逆向解析喜马拉雅新版xm-sign算法:从dws.1.6.8.js到签名生成

本文详细解析了喜马拉雅新版xm-sign算法的逆向破解方法。通过定位核心JS文件dws.1.6.8.js,构建本地Node.js模拟执行环境,并解密关键参数cid与appKey,最终实现签名算法的本地化稳定生成,为数据采集提供可靠解决方案。

weixin_29250403的博客 210

图数据库Neo4j面试内容整理-Neo4j的性能

在执行复杂关系查询时,Neo4j 通过图结构的高效存储和查询机制,能够比传统的关系型数据库提供更快的性能,尤其是在涉及深层关系的查询时。通过合理的配置、优化查询和使用合适的硬件,Neo4j 可以处理大规模的数据集和高并发的查询请求,满足企业级应用的需求。Neo4j 在处理图数据时,通过优化图的存储、查询和遍历等方面,提供了高效的性能,特别适合用于需要处理复杂关系和多层次连接的应用场景,如社交网络、推荐系统、知识图谱等。:Neo4j 会根据查询的结构和数据的分布自动选择最优的查询计划。

不务正业的猿 585

K-BERT: Enabling Language Representation with Knowledge Graph 代码复现 直接运行

K-BERT: Enabling Language Representation with Knowledge Graph K-BERT K-BERT 代码复现

1072

Prompt Engineering 学习指南:从入门到精通的最佳路径与资源

随着大型语言模型(LLM)能力的飞速发展,Prompt Engineering(提示工程)已成为人与AI协作的核心技能。本报告旨在为不同水平的学习者提供一条清晰、高效的学习路径,整合了当前社区公认的最佳实践和顶级开源资源,帮助您系统地掌握 Prompt Engineering,释放 LLM 的全部潜力。保持好奇心,不断尝试,您将能驾驭语言模型这一强大的工具,创造出前所未有的价值。超越简单的“一问一答”,学习如何将 Prompt Engineering 与外部工具和数据结合,构建强大的 AI 应用。

shiter编写程序的艺术 697

STM32堆栈溢出问题及解决方法

堆栈是用于存储函数调用和局部变量的内存区域,它是一种先进后出的数据结构。如果函数嵌套层级过深或者局部变量占用的内存空间过大,堆栈的大小可能不足以容纳这些信息,从而导致堆栈溢出。在一些特殊情况下,可以使用堆内存替代堆栈,以避免堆栈溢出问题。在STM32的工程中,可以通过修改链接脚本文件(.ld文件)中的堆栈大小参数来增加堆栈空间。通常,堆栈大小设置为RAM的一小部分,但需要根据具体应用的需求进行调整。堆栈溢出是嵌入式系统开发中常见的问题之一,特别是在使用STM32微控制器时。3.3 使用堆内存替代堆栈。

ZwcCsharp的博客 2593

C# WinForm 基于DirectShow.dll编写的程序,可边预览边保存视频,音频和图片

基于微软的DirectShow.dll的二次开发1.自动识别连接的摄像头跟麦克风且可以对其进行选择(默认选中第一个)2.可录制wmv和avi两种格式的视频并且都带有音频,avi可以录制的分辨率和帧数进行选择,wmv默认进行了淸晰度优化如不喜欢可去除代码中有相关提示3.可在预览点开之后进行拍照,也可边录制视频边拍照4.添加了视频和音频的压缩功能(酌情使用)这次二次开发发现C#对DirectShow的相关信息太少,这次做完也不敢藏私共享出来,还望大家指正

visio安装包

Microsoft Office Visio 是一款专业的制图软件。利用经过更新的形状、协作工具和数据链接图表,创建专业级图表以简化复杂的信息。

Statistics and Machine Learning Toolbox

Statistics and Machine Learning Toolbox(带书签),MATLAB统计学习工具

jre9下载 jdk9

(Java SE Runtime Environment 9.0) 9.0u175 官方最新版 【x86|x64】

上一篇: 抖音、视频号流行的 Bokeh(虚化) 效果是怎么实现的?
下一篇: OpenGL ES 3.0 帧缓冲区失效 glInvalidateFramebuffer
字节流动
字节流动 优质创作者: 编程框架技术领域 优质创作者: 编程框架技术领域 领域专家: 嵌入式与硬件开发技术领域 领域专家: 嵌入式与硬件开发技术领域
博客等级 码龄11年 1912粉丝 168原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

字节流动

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值