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

参考: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. 利用sql_tuning_Advisor调优sql

    1.赋权给调优用户 grant ADVISOR to xxxxxx; 2.创建调优任务 使用sql_text创建 DECLARE my_task_name VARCHAR2 (30); my_sqlt ...

  2. oracle视图添加hint

    /* Formatted on 2019/8/6 下午 02:51:21 (QP5 v5.163.1008.3004) */ SELECT DB FROM ( SELECT /*+ index(A.r ...

  3. 单线程的as-if-serial语义

    单线程的as-if-serial语义 关于指令重排序有个问题不明白的一个问题 int a = 2; int c = 1 + a; float b = 3f / 2f; 举个栗子,从CPU的设计者以及编 ...

  4. postgresql-12编译安装

    1 准备环境 修改yum源 mkdir -p /etc/yum.bak mv /etc/yum.repos.d/* /etc/yum.bak/ &&\ curl -o /etc/yum ...

  5. Linux中让终端输入变为非阻塞的三种方法

    介绍 在linux下每打开一个终端,系统自动的就打开了三个文件,它们的文件描述符分别为0,1,2,功能分别是"标准输入"."标准输出"和"标准错误输出 ...

  6. 转 11 jmeter之图形监控扩展

    11 jmeter之图形监控扩展   Jmeter默认监听器的缺陷 Jmeter默认的监听器在表格.文字方面比较健全,但是在图形监控方面比较逊色,尤其在监控Windows或Linux的系统资源方面.但 ...

  7. 为什么Go自带的日志默认输出到os.Stderr?

    为什么Go自带的日志默认输出到os.Stderr? - 知乎 https://www.zhihu.com/question/67629357 Note that the Go runtime writ ...

  8. You shouldn't use *any* general-purpose hash function for user passwords, not BLAKE2, and not MD5, SHA-1, SHA-256, or SHA-3

    hashlib - Secure hashes and message digests - Python 3.8.3 documentation https://docs.python.org/3.8 ...

  9. GDB查看内存命令(x命令) 用gdb查看指定地址的内存内容

    GDB查看内存命令(x命令) - super119 - 博客园 https://www.cnblogs.com/super119/archive/2011/11/18/2254382.html 可以使 ...

  10. 【转】DDD-应用架构

    简介: 应用架构,指软件系统中固定不变的代码结构.设计模式.规范和组件间的通信方式.在应用开发中架构之所以是最重要的第一步,因为一个好的架构能让系统安全.稳定.快速迭代.但是今天我们在做业务研发时,更 ...