这里嵌入指不会因为本地文件丢失而丢失。

参考:https://blog.csdn.net/testcs_dn/article/details/78952358

https://blog.csdn.net/testcs_dn/article/details/78952358

使用 Data Url 将文件存入 markdown 文档流

在线生成Data Url:

http://imgbase64.duoshitong.com/

https://tool.css-js.com/base64.html

使用 Data Url 的不足:

1、会让文档体积变得很大!

2、IE6/7是不支持Data URL技术的,不幸的是在中国还有很多用户在使用这种古老的浏览器。希望各方面包括官方和民间都多做努力工作,让现代浏览器(谷歌浏览器,火狐浏览器,IE11+)尽快的占领市场,这是我们Web程序员最大的愿望。

使用 Data Url 的优点:

说到Data URI的优点,自然少不了“减少链接数”,把图片转为Base64编码,以减少图片的链接数。我们先想当然一下,同样一张图片,如果不用发起一个下载请求,打开速度是会更快的。但是,有几个问题需要关注下:

图片始终是要下载的,那么下载一张图片的速度快还是下载一堆编码快?

浏览器对图片的显示,处理效率哪个更快?

图片的缓存问题

  原文测试,使用Data URL方式的Demo在渲染时会比不使用 多消耗53%左右的CPU资源,内存多出4倍左右,耗时平均高出24.6倍 。由此可见,使用Data URl方式还是需要更多的考量,在可接受的范围内适量使用。

markdown嵌入图片的更多相关文章

  1. MarkDown插入图片

    MarkDown插入图片的语法 ·编辑器:MacDown 比如博客园的Logo,URL是 http://static.cnblogs.com/images/logo_small.gif 在要插入图片的 ...

  2. 为jquery qrcode生成的二维码嵌入图片

    在一次微信项目中,需要实现通过扫描二维码来进行会议签到,二维码的生成选择了qrcode.js的版本,然后使用jquery.qrcode.js插件来绘制二维码. <script type=&quo ...

  3. 关于Markdown插入图片路径错误的问题

    关于Markdown插入图片路径错误的问题 开发问题 解决方法  妈耶,连续一天写2篇博客,也是醉了,这篇博客主要是介绍关于Markdown插入图片路径错误的问题 在上篇中,我介绍了一下Markdow ...

  4. 可嵌入图片视频jQuery全屏滑块

    分享一款可嵌入图片视频jQuery全屏滑块.这是一款可定制的滑块幻灯片代码,支持键盘箭头切换.效果图如下: 在线预览   源码下载 实现的代码. html代码:     <script type ...

  5. markdown的图片外链

    markdown的图片用本地的很不方便,今天试用了一下七牛的服务,感觉很好用.推荐一下,免费的服务够用并且比较友好.

  6. Markdown引用图片,且不使用网上链接的解决方法

    首先介绍下markdown使用图片的3种方法 使用本地图片,缺点是要用到本地的绝对路径,不适合对文档做迁移,否则会有图片链接失效的情况 ![thisisimage](C:\\Users\\Goose\ ...

  7. html5--1.9 img元素嵌入图片

    html5--1.9 img元素嵌入图片 学习要点: img元素嵌入图片学习一个新属性:title 1.img的属性 1.src:必要属性,制定图片来源的路径; 2.alt属性:当图片无法显示时的替代 ...

  8. 【Tips】有道云笔记中Markdown插入图片

    在有道云笔记中用MarkDown插入图片 新建一个文档专门用来放图片 把所有要用的图片专门放在一个笔记里,用普通模式先同步笔记,然后用分享笔记 会有一个链接,用浏览器打开这个分享的笔记就能找到所有的图 ...

  9. 优雅地在markdown插入图片

    markdown 中插入图片,好烦!!!   喜欢用Markdown写文字,但是它的图片引用是一个大问题(当然csdn不会遇到这个问题).借用第三方将图片储存在印象笔记上是一个好办法.但是会出现的一个 ...

随机推荐

  1. Gulp4.0入门和实战

    gulp4.0入门和实战 我最近遇到需要优化web的性能的任务,然后就捣鼓了一些对资源文件优化压缩的方案.由于之前的项目中有使用到gulp,所以在需要处理的web项目中也优先使用这个技术. 先聊聊gu ...

  2. 跨平台导PDF,结合wkhtmltopdf很顺手

    前言 好东西要分享,之前一直在使用wkhtmltopdf进行pdf文件的生成,常用的方式就是先安装wkhtmltopdf,然后在程序中用命令的方式将对应的html生成pdf文件,简单而且方便:但重复的 ...

  3. 写给 Linux 初学者的一封信

    大家好,我是肖邦. 这篇文章是写给 Linux 初学者的,我会分享一些作为初学者应该知道的一些东西,这些内容都是本人从事 Linux 开发工作多年的心得体会,相信会对初学者有所帮助.如果你是 Linu ...

  4. Centos 7 网卡配置

    网卡配置位置 1 /etc/sysconfig/network-scripts/ifcfg-ethx  -----其中x为网卡名称,centos 默认网卡名称为ens33 如何配置  1 2 3 4 ...

  5. Java中的Date类型无法赋值给数据库的datetime类型

    因为Java中new Date()的结果是"Thu Aug 27 19:03:54 CST 2020",而mysql中的datetime不接受这样的日期格式,插入数据会报错. 解决 ...

  6. 写给 Poppy 的 MySQL 速查表

    昨天 Poppy 问我是不是应该学一些网页开发的东西, 我的回答是这样的: 今天花了点时间汇总了一些 MySQL 简单的命令. ======== 正文分割线 ======== 有哪些常见的数据库: O ...

  7. 编写Hello World ts程序

    准备工作 预装软件NodeJs和VSCode 新建文件夹ts_in_action npm命令初始化工程:npm init -y,生成package.json文件 全局安装TypeScript:npm ...

  8. copy,集合

    一.基础数据类型补充: 1种方法:删除列表里面的元素时,一定不能循环列表,会出错.可以循环索引,然后循环删除开头或结尾这个位置的元素(原开头结尾的元素被删除之后,会有新的元素顶上来). 2种方法:把要 ...

  9. 武装你的WEBAPI-OData常见问题

    本文属于OData系列 目录 武装你的WEBAPI-OData入门 武装你的WEBAPI-OData便捷查询 武装你的WEBAPI-OData分页查询 武装你的WEBAPI-OData资源更新Delt ...

  10. Jenkins(2)docker容器中安装python3

    前言 使用docker安装jenkins环境,jenkins构建的workspace目录默认是在容器里面构建的,如果我们想执行python3的代码,需进容器内部安装python3的环境. 进jenki ...