前端超分辨率技术应用:图像质量提升与场景实践探索-设计篇

超分辨率!

引言

在数字化时代,图像质量对于用户体验的重要性不言而喻。随着显示技术的飞速发展,尤其是移动终端视网膜屏幕的广泛应用,用户对高分辨率、高质量图像的需求日益增长。然而,受限于网络流量、存储空间和图像源质量等因素,获取高分辨率图像并非总是可行的。

超分辨率技术简介

超分辨率图像技术(Super-Resolution Image Technology,简称“超分”)应运而生,旨在通过智能化方法放大图像,提升分辨率,同时去除压缩噪声,从而获得更清晰、更锐利的图像。这项技术的应用场景广泛,包括提升压缩图像的画质、节省存储和流量、以及高质量放大图像等。

为何选择超分辨率技术?

随着显示设备分辨率的逐步提高,尤其是移动终端视网膜屏幕的广泛应用,人们对高分辨率、高质量图像的需求越来越突出。但是,由于网络流量、存储、图像源等诸多原因,我们往往无法获得高分辨率的图像,或者因为JPEG压缩,导致图像质量显著降低。

超分辨率技术的应用场景

  • 抑制压缩噪声:1倍的超分辨率用于提升高压缩率JPEG图像的画质,因为它可以有效去除JPEG的压缩噪声,对于无法找到更清晰图像源的图片,这是一个有效的解决方案。

  • 节省存储和流量:作为图像资源的提供方,我们还可以人为加大JPEG图像的压缩率(主动降低画质),将高压缩率的图像存储,并在网络上传送。图像传送到终端后,再使用1倍超分辨率提升画质,我们就可以在更少的画质损失前提下,进一步压缩图像,节省存储空间,减少流量。

  • 高质量放大图像:3倍的超分辨率不仅能将图像放大3倍(每边各3倍),得到比传统放大更清晰的细节,还能有效抑制原图像中的JPEG压缩噪声,面对越来越高的手机屏幕分辨率,这将大大改善小图像放大浏览时的体验。

业务简介

随着显示设备的分辨率逐步提高,尤其是移动终端视网膜屏幕的广泛应用,人们对高分辨率、高质量图像的需求越来越突出。但是,因为网络流量、存储、图片源等诸多原因,我们往往无法得到高分辨率的图像,或者因为JPEG压缩,导致图像质量显著降低。

总结收益

对于厂商

显著提升商品图片画质,节省流量流量成本,有效改善图片加载卡顿问题。

对于用户:

同等清晰度,数据流量消耗大大降低,图片加载速度更快。

各种不同模型效果对比

How怎么做?

如何选择打造适合项目的超分组件呢

下面以Android为例子

1. 选择合适的深度学习框架

以Android为例,我们进行了多组数据测试,并将部分数据进行汇总。通过比较不同框架的优缺点,我们发现使用华为NPU能力能够充分发挥手机性能、能够满足项目使用。先使用华为官方接口实现相关功能跑通流程,再去使用支持的华为NPU能力第三方框架增加通用性,并选择适合的模型。

类型

厂商

描述

图片

耗时

评价

原图

/

3kb 50x50

/

Tensorflow lite

google

4倍后的图片

gpu

440ms

优点:具有通用性(Android/ios),tensorflow一条龙全家桶很香

缺点:性能相对较差

HUAWEI HIAI

huawei

3倍后的图片

npu

首次初始化30ms

之后就3ms

优点:速度快

缺点:仅华为npu设备可用

ncnn

Tencent

3倍后的图片 gpu

使用的是cli模式运行模型

898ms

陪跑而已 该模式下数据不重要

另一组数据

2. 集成到项目中

当然要跟图片框架结合了,超分辨率技术需要与图片框架结合使用。

我们可以选择老牌王者Glide,或者新晋黑马Coil。Coil是一个高效、轻量级且易于使用的Android图片加载库,它首选Kotlin语言开发,并且使用包含Coroutines、OkHttp、Okio和AndroidX Lifecycles在内的最流行的开源库。

Coil与Glide对比

Coil & Glide v4 快速高效的Android图片加载库

描述

大家对glide比较了解 不清楚的朋友看👆那个官方文档, 说下新晋黑马

Coil特点

1.Coil 首选 Kotlin 语言开发并且使用包含 Coroutines, OkHttp, Okio 和 AndroidX Lifecycles 在内最流行的开源库。

2.动态采样(Dynamic image sampling),简而言之就是可以在内存中只缓存了一个低质量的图片而此时需要显示同一个高质量的图片时,Coil可以先把低质量的图片作为 ImageView 的 placeHolder 并同时去磁盘缓存中读取对应的高质量图片最后以“渐进式”的方式替换并最终显示到视图中,例如最常见的从图片列表到预览大图的场景。对项目有帮助 看看能不能学习一下这个机制,渐进式替换原有生成高清图。

  • 更快: Coil 在性能上做了很多优化,包括内存缓存和磁盘缓存、对内存中的图片进行采样、复用 Bitmap、支持根据生命周期变化自动暂停和取消图片请求等

  • 更轻量级: Coil 大约会给你的 App 增加两千个方法(前提是你的 App 已经集成了 OkHttp 和 Coroutines),Coil 的方法数和 Picasso 相当,相比 Glide 和 Fresco 要轻量级很多

  • 更容易使用: Coil's API 充分利用了 Kotlin 语言的新特性,简化并减少了很多重复代码

  • 更流行: Coil 首选 Kotlin 语言开发,并且使用包含 Coroutines、OkHttp、Okio 和 AndroidX Lifecycles 在内的更现代化的开源库

性能对比

参考数据:coil:1.4.0、glide:4.12.0

在当时版本情况下coil与gilde性能对比

不管是小图还是大图都有些许差距,但现在coil都2.6.0了 可以再对比一次

500k相对大图加载对比
小图加载对比
总结

如果是新项目用到 Coroutines、OkHttp、Okio 和 AndroidX Lifecycles,还是很推荐用Coil的,至于本次项目,当然是全适配咯.

3.具体怎么设计?

1.0版本 在设计超分辨率组件时,可以将核心处理流程封装在一个处理核心库中,并根据不同的图片加载框架(如Glide和Coil)提供相应的包装库。这样的设计既保证了功能的复用性,又提高了组件的灵活性和扩展性。

一个处理核心和为glide和coil框架提供插件

展望

Android移动端超分辨率调研 本来跟着这个填坑来的, 结果埋了更多的坑。目前具体代码 项目已经写完了,再整理一版。

参考资源

华为 HiAI Engine 指南

深度学习框架大PK:TNN决战MNN,ncnn依旧经典

Coil 和 Glide 的 Bitmap 缓存复用机制

Glide VS Coil 性能对比 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/499779.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

代码随想录算法训练营第35天| 435. 无重叠区间、763.划分字母区间、56. 合并区间

435. 无重叠区间 题目链接:无重叠区间 题目描述:给定一个区间的集合 intervals ,其中 intervals[i] [starti, endi] 。返回 需要移除区间的最小数量,使剩余区间互不重叠 。 解题思想: 这道题目和射气球很像。 *“需…

深入浅出MySQL主从复制与读写分离原理及其实践

目录 一、主从复制 (一)主从复制简介 1.基本概述 2.复制类型 (二)主从复制流程与影响因素 1.主从复制的流程 2.影响因素 (三)实现主从复制 1.搭建时间同步 2.配置master服务器 2.1 开启二进制日…

C++11入门手册第一节,学完直接上手Qt(共两节)

入门 hello.cpp #include <iostream>int main() { std::cout << "Hello Quick Reference\n"<<endl; return 0;} 编译运行 $ g hello.cpp -o hello$ ./hello​Hello Quick Reference 变量 int number 5; // 整数float f 0.95; //…

分享vue3+OpenTiny UI+cesium.js实现三维地球

效果图 使用vue3 OpenTiny UI cesium 实现三维地球 node.js > v16.0 opentiny vue3 ui安装指南 https://opentiny.design/tiny-vue/zh-CN/os-theme/docs/installation yarn add opentiny/vue3 项目依赖 "dependencies": {"opentiny/vue": "3…

每日一练 两数相加问题(leetcode)

原题如下&#xff1a; 这道题目是一道链表题&#xff0c;我们对于这种链表类&#xff0c;很显然我们最后输出的是初始节点&#xff0c;所以我们要保留我们的初始头指针&#xff0c;那么我们的第一步一定是把头指针保留一份&#xff0c;然后再让头指针往后进行操作。那么我们进行…

EXCEL VBA根据表数据写入数据库中

EXCEL VBA根据表数据写入数据库中 Option Explicithttps://club.excelhome.net/thread-1687531-1-1.htmlSub UpdateAccess()Const adStateOpen 1Dim vData, i As Variant, j As LongDim AccessTable As String, ExcelTable As String, ExcelFile As String, AccessFile As Str…

SD-WAN安全策略,保护企业网络的新边界

随着企业的数字化转型和网络架构的演变&#xff0c;SD-WAN&#xff08;软件定义广域网&#xff09;作为一种新兴的网络技术&#xff0c;正在逐渐取代传统的基于硬件的广域网架构。然而&#xff0c;随之而来的安全威胁也在增加&#xff0c;因此在部署 SD-WAN时&#xff0c;制定合…

【python】深入探讨flask是如何预防CSRF攻击的

✨✨ 欢迎大家来到景天科技苑✨✨ &#x1f388;&#x1f388; 养成好习惯&#xff0c;先赞后看哦~&#x1f388;&#x1f388; &#x1f3c6; 作者简介&#xff1a;景天科技苑 &#x1f3c6;《头衔》&#xff1a;大厂架构师&#xff0c;华为云开发者社区专家博主&#xff0c;…

文本文件操作

大家好&#xff1a; 衷心希望各位点赞。 您的问题请留在评论区&#xff0c;我会及时回答。 文件操作 程序运行时&#xff0c;产生的数据都是临时数据&#xff0c;程序一旦运行结束都会被释放。通过文件可以将数据持久化。 C中对文件进行操作需要包含头文件<fstream> 文件…

spark-看看视频每章总结

一 spark基础 1.spark特点 2.spark架构 3.spark部署 4.代码执行流程 先由driver构建sparkcontext对象&#xff0c;再由executor分布式执行&#xff0c;结果汇集到driver上输出 二 sparkcore 1.RDD 2.RDD算子 3.宽窄依赖p100 4.spark内存计算 三.sparksql 1.spark SQL和spar…

机器学习中的XGBoost模型及其优缺点(包含Python代码样例)

目录 一、简介 二、优缺点 三、样例代码 四、总结 一、简介 XGBoost&#xff08;eXtreme Gradient Boosting&#xff09;是一种机器学习算法&#xff0c;用于解决分类和回归问题。它是基于梯度提升树&#xff08;Gradient Boosting Decision Trees&#xff09;方法的扩展&…

HarmonyOS像素转换-如何使用像素单位设置组件的尺寸。

1 卡片介绍 基于像素单位&#xff0c;展示了像素单位的基本知识与像素转换API的使用。 2 标题 像素转换&#xff08;ArkTS&#xff09; 3 介绍 本篇Codelab介绍像素单位的基本知识与像素单位转换API的使用。通过像素转换案例&#xff0c;向开发者讲解了如何使用像素单位设…

【AI】『Suno』哎呦不错呦,AI界的周董,快来创作你的歌曲吧!

前言 &#x1f34a;缘由 Suno AI的旋风终于还是吹到了音乐圈 &#x1f3c0;事情起因&#xff1a; 朋友说他练习时长两天半&#xff0c;用Suno发布了首张AI音乐专辑。震惊之余&#xff0c;第一反应是音乐圈门槛也这么低了&#xff0c;什么妖魔鬼怪都可以进军了嘛&#xff01;…

Java后端需要掌握的前端知识

第一章. HTML 与 CSS HTML 是什么&#xff1a;即 HyperText Markup language 超文本标记语言&#xff0c;咱们熟知的网页就是用它编写的&#xff0c;HTML 的作用是定义网页的内容和结构。 HyperText 是指用超链接的方式组织网页&#xff0c;把网页联系起来Markup 是指用 <…

Elasticsearch 开放 inference API 增加了对 Cohere Embeddings 的支持

作者&#xff1a;来自 Elastic Serena Chou, Jonathan Buttner, Dave Kyle 我们很高兴地宣布 Elasticsearch 现在支持 Cohere 嵌入&#xff01; 发布此功能是与 Cohere 团队合作的一次伟大旅程&#xff0c;未来还会有更多合作。 Cohere 是生成式 AI 领域令人兴奋的创新者&…

开始时间大于结束时间

1.dom中代码&#xff0c;监听所选日期值的变化&#xff0c;并把需要比较的时间字段作为参数传到监听方法中&#xff0c; <el-form-item label"起始日期" prop"startTime"><el-date-picker clearable size"small":disabled"isDisa…

从TCP/IP协议到socket编程详解

​ 我的所有学习笔记&#xff1a;https://github.com/Dusongg/StudyNotes⭐⭐⭐ ​ 文章目录 1 网络基础知识1.1 查看网络信息1.2 认识端口号1.3 UDP1.4 TCP1.4.1 确认应答机制1.4.2 TCP三次握手/四次挥手为什么是三次握手为什么是四次挥手listen 的第二个参数 backlog—— 全…

【项目技术介绍篇】若依开源项目RuoYi-Cloud后端技术介绍

作者介绍&#xff1a;本人笔名姑苏老陈&#xff0c;从事JAVA开发工作十多年了&#xff0c;带过大学刚毕业的实习生&#xff0c;也带过技术团队。最近有个朋友的表弟&#xff0c;马上要大学毕业了&#xff0c;想从事JAVA开发工作&#xff0c;但不知道从何处入手。于是&#xff0…

基于微信小程序的日语词汇学习设计与实现(论文+源码)_kaic

日语词汇学习小程序 摘 要 日语词汇学习小程序是高校人才培养计划的重要组成部分&#xff0c;是实现人才培养目标、培养学生科研能力与创新思维、检验学生综合素质与实践能力的重要手段与综合性实践教学环节。本学生所在学院多采用半手工管理日语词汇学习小程序的方式&#x…

【训练时如何指定GPU或者CPU】

【训练时如何指定GPU或者CPU】 【先赞后看养成习惯】求关注点赞收藏&#xff01;&#xff01;&#xff01;&#x1f60a; 如果不知道自己电脑是否支持GPU或者CPU&#xff0c;我们可以使用下面这句命令&#xff0c;那么它会优先去调用GPU&#xff0c;如果没有GPU&#xff0c;就…