最全的docx,pptx,xlsx(excel),pdf文件预览方案总结
最近遇到了文件预览的需求,但一搜索发现,这还不是一个简单的功能。于是又去查询了很多资料,调研了一些方案,也踩了好多坑。最后总结方案如下 1. 花钱解决(使用市面上现有的文件预览服务) 1. 微软 2. google 3. 阿里云 IMM 4. XDOC 5. Office Web 365 6. wps开放平台 2. 前端方案 1. pptx的预览方案 2. pdf的预览方案 3. docx的预览方案 4. xlsx(excel)的预览方...
开源文档预览项目 kkFileView
kkFileView 是一款文件文档在线预览解决方案,采用流行的 Spring Boot 框架构建,易于上手和部署。 该项目基本支持主流办公文档的在线预览,包括但不限于 doc、docx、xls、xlsx、ppt、pptx、pdf、txt、zip、rar,以及图片、视频、音频等格式。 拉取镜像: 运行容器 浏览器访问容器 8012 端口 即可看到项目演示用首页。 上传一个文件之后,点击预览,即可查看该文件预览效果。 项目内需要预览文件时...
不同的字体文件类型(OTF、TTF、WOFF、WOFF2)
因为公司的一些业务,需要对字体的相关概念有一定的了解,这里稍微记录下。 首先,我们先来知道下,常见的几种字体文件类型。 只需要一个文件,包含一个单独的字体样式文件(普通、斜体、粗体等) 。TrueType 文件格式仅用于屏幕,字体文件的扩展名是 兼容性如下: 它基于支持扩展字符集(连字、替代样式、字形等)的 TrueType 格式 字体文件的扩展名: 包含 TrueType 字体的 OpenType 文件后缀名为 。 包含 PostSc...
字体加载的几种方案
众所周知,中文字体文件都是比较大的,且还有不同的字重,如果需要加载所有字重的字体文件,那体积就更加夸张,本文简述字体加载的几种方案,以及如何选择合适的方案。 正文 我们可以看到,一个包含所有字重的思源黑体文件大小有 30MB,这个体积是非常夸张的。 如果我们需要对所有字体文件做加载,那么加载时间就会过长,很影响首屏时间。所以我们可以根据业务场景来使用不同的字体加载方案。 全量加载字体 虽然全量加载字体的操作对首屏的性能影响比较大,但是部...
网站中文字体包优化指南
原文地址(本人博客): 在开发中文网站时,我们通常需要下载汉字字体包,但众所周知,汉字字体包的体积通常比较大,以谷歌字体中的 字体为例,直接下载下来的完整字体文件体积为17.7MB。 17.7MB的大小对于一个页面资源来说是巨大的;尽管现代的网络环境中,许多浏览器和服务器已经开始广泛支持 HTTP/2 协议或者更高版本的协议,单个网络资源的请求并不影响其他资源的传输,但其可能会占用大量带宽其他资源的请求可能会因为带宽限制而排队等待传输。...
如何减少网页卡顿
关于如何提高 JavaScript 应用速度的常见建议通常包括“不要阻塞主线程”和“拆分长任务”。 本页详细介绍了这些建议的含义,以及使用 JavaScript 优化任务的重要性。 什么是任务? 任务是指浏览器执行的任何独立工作。这包括呈现、解析 HTML 和 CSS、运行您编写的 JavaScript 代码,以及您无法直接控制的其他事项。网页的 JavaScript 是浏览器任务的主要来源。 由 click 事件处理脚本启动的任务,显...
跨窗口(标签页)通信方法
一、前言 最近需求有跨标签页操作,借此总结跨窗口(标签页)通信的常用方法,包括同源和跨域两种情况,给出的示例代码能让你快速上手。 二、同源 localStorage 配合 storage 事件:简单、兼容性好 Broadcast Channel API:功能全 三、跨域 利用 iframe 的 postmessage 接口 (注意修改子页面的 iframe 地址) 启动示例: 如果帮到你了,可以点个赞,欢迎交流沟通。
使用 WebCodec 在浏览器解码视频、抓帧截图、转GIF
在浏览器内将视频转GIF,无需上传,速度飞快 ✨ 已上线 使用 ffmpeg 生成高质量GIF,全是技巧和折磨 上周五写一个材料的时候,需要插入几个 GIF 演示动图。一开始我熟练的打开终端,使用了我这段祖传 ffmpeg 生成高质量 GIF 的命令: 但是转换过程不太顺利,因为输出的 GIF 文件太大了,我不得不去精细地调整参数,把各种骚操作都尝试一遍,包括但不限于: 剪辑视频:在 前插入想要的时间范围 调整分辨率: 表示宽度 320...
浏览器画中画
作者GitHub: 有兴趣可关注!!! 尽管效果可以,但是api兼容性不理想🤦 安全上下文 :此功能仅在安全上下文(HTTPS)中可用,在某些或所有支持的浏览器中。 Document Picture in Picture API(文档画中画API) 文档画中画API(pip api)可以打开一个始终在顶部的窗口, 该窗口可以填充任意HTML内容 ,它扩展了早期的 画中画API,专门支持将HTML 元素放入始终在顶部的窗口中。 兼容性...