dlrandy / note-issues

2 stars 0 forks source link

source map deal #117

Open dlrandy opened 5 years ago

dlrandy commented 5 years ago

https://docs.trackjs.com/data-management/minified-sources/

https://itnext.io/using-sourcemaps-on-production-without-revealing-the-source-code-%EF%B8%8F-d41e78e20c89

dlrandy commented 5 years ago

HTTP简介

为什么需要http2?他解决了什么问题? 如需在线托管MarkDown文档,建议选择文档仓库,这是一个永久免费的中文文档在线管理工具,支持Markdown和富文本实时编辑预览,支持文档历史对比功能,支持私有文档和加密分享和本编辑器功能趋近。

Markdown是一种轻量级的「标记语言」

markdown

Markdown是一种可以使用普通文本编辑器编写的标记语言,通过简单的标记语法,它可以使普通文本内容具有一定的格式。它允许人们使用易读易写的纯文本格式编写文档,然后转换成格式丰富的HTML页面,Markdown文件的后缀名便是“.md”

web 是如何工作的?

浏览器的地址栏输入了一个网址, 按下回车发生了什么?

Browser->DNS Server: what's ip of this Domain name
DNS Server->Browser: that Domain name's ip: 234.2.22.33
Browser->Web Server(234.2.22.33): Open TCP Connection
Browser->Web Server(234.2.22.33):Request web page(where the http comes in)
Web Server(234.2.22.33)->Browser:home page or redirect
Note left of Browser:process returned request
Browser->Web Server(234.2.22.33):request other resources(css/js/images)
Web Server(234.2.22.33)->Browser:return other resources(css/js/images)
Note left of Browser: browser has enough critical resource\n so start to render web page
Browser->Web Server(234.2.22.33):request other resources(css/js/images)
Web Server(234.2.22.33)->Browser:return other resources(css/js/images)
Note left of Browser:Onload Event
Browser->Web Server(234.2.22.33):request other resources(css/js/images)
Web Server(234.2.22.33)->Browser:return other resources(css/js/images)

End

Markdown增强版中比较有名的有Markdown Extra、MultiMarkdown、 Maruku等。这些衍生版本要么基于工具,如Pandoc,Pandao;要么基于网站,如GitHub和Wikipedia,在语法上基本兼容,但在一些语法和渲染效果上有改动。

MdEditor源于Pandao的JavaScript开源项目,开源地址Editor.md,并在MIT开源协议的许可范围内进行了优化,以适应广大用户群体的需求。向优秀的markdown开源编辑器原作者Pandao致敬。

Pandao editor.md

Internet VS World Wide Web

internet是使用互联网协议(IP)连接在一起的公共计算机的集合。他是由多个services组成:world wide web(web), Email, File Sharing 以及网络电话等.所以 Internet和 WEB的区别就是 Internet是使用IP通信的公共计算机的集合,web是Internet的一个Service/组成部分。

Web

Tim Berners Lee创建web的时候,定义了三种技术:Http, URL,Html。web使用了http协议,而其他的service都有各自的协议和标准。Email:SMTP, POP,IMAP。在HTTP的基础上又建立了一些新的services:REST, SOAP等。流行的IoT通常使用的是HTTP REST。

Http

Http依赖于可靠的网络连接,通常是有TCP/IP提供的.http的基本语法就是基于text的request 和 response。http的成功在于简单性,http2则是牺牲了一些简单性来换取效率。

Open Systems Interconnection (OSI) Model

ap=>start: Application Layer(http)
pl=>operation: Presentation Layer(File type)
sl=>operation: Session Layer(Tsl)
tsl=>operation: Transport&Session Layer(TCP)
nl=>operation: Internet Layer(IP)
dll=>operation: Data Link Layer(以太网)
psl=>operation: Psysical Layer(Cable/wifi)
e=>end: 通过介质进行传输

ap->pl->sl->tsl->nl->dll->psl->e

[========]

Http History

web server 只需要TCP/IP connection来接收HTTP Request。server可以根据header来决定如何处理request。 putty是一个ssh和telnet的客户端。

什么是微服务?

application被分解成多个独立的web services,通常是基于轻量级的app server。微服务的爆炸在于它的简单性, 但是一个事物涉及到多个service的时候,应该会复杂吧?求后端指点

server为什么不存储request的信息?

request太多了,存不起。:smile:

标题H3

标题H4

标题H5
标题H5

字符效果和横线等


删除线 删除线(开启识别HTML标签时)

斜体字 斜体字

粗体 粗体

粗斜体 粗斜体

上标:X2,下标:O2

缩写(同HTML的abbr标签)

即更长的单词或短语的缩写形式,前提是开启识别HTML标签时,已默认开启

The HTML specification is maintained by the W3C.

引用 Blockquotes

引用文本 Blockquotes

引用的行内混合 Blockquotes

引用:如果想要插入空白换行即<br />标签,在插入处先键入两个以上的空格然后回车即可,普通链接

锚点与链接 Links

普通链接 普通链接带标题 直接链接:https://www.mdeditor.com 锚点链接

mailto:test.test@gmail.com GFM a-tail link @pandao 邮箱地址自动链接 test.test@gmail.com www@vip.qq.com

@pandao

多语言代码高亮 Codes

行内代码 Inline code

执行命令:npm install marked

缩进风格

即缩进四个空格,也做为实现类似 <pre> 预格式化文本 ( Preformatted Text ) 的功能。

<?php
    echo "Hello world!";
?>

预格式化文本:

| First Header  | Second Header |
| ------------- | ------------- |
| Content Cell  | Content Cell  |
| Content Cell  | Content Cell  |

JS代码

function test() {
    console.log("Hello world!");
}

HTML 代码 HTML codes

<!DOCTYPE html>
<html>
    <head>
        <mate charest="utf-8" />
        <meta name="keywords" content="Editor.md, Markdown, Editor" />
        <title>Hello world!</title>
        <style type="text/css">
            body{font-size:14px;color:#444;font-family: "Microsoft Yahei", Tahoma, "Hiragino Sans GB", Arial;background:#fff;}
            ul{list-style: none;}
            img{border:none;vertical-align: middle;}
        </style>
    </head>
    <body>
        <h1 class="text-xxl">Hello world!</h1>
        <p class="text-green">Plain text</p>
    </body>
</html>

图片 Images

图片加链接 (Image + Link):

Follow your heart.


列表 Lists

无序列表(减号)Unordered Lists (-)

无序列表(星号)Unordered Lists (*)

无序列表(加号和嵌套)Unordered Lists (+)

有序列表 Ordered Lists (-)

  1. 第一行
  2. 第二行
  3. 第三行

GFM task list


绘制表格 Tables

项目 价格 数量
计算机 $1600 5
手机 $12 12
管线 $1 234
First Header Second Header
Content Cell Content Cell
Content Cell Content Cell
First Header Second Header
Content Cell Content Cell
Content Cell Content Cell
Function name Description
help() Display the help window.
destroy() Destroy your computer!
Left-Aligned Center Aligned Right Aligned
col 3 is some wordy text $1600
col 2 is centered $12
zebra stripes are neat $1
Item Value
Computer $1600
Phone $12
Pipe $1

特殊符号 HTML Entities Codes

© & ¨ ™ ¡ £ & < > ¥ € ® ± ¶ § ¦ ¯ « ·

X² Y³ ¾ ¼ × ÷ »

18ºC " '

[========]

Emoji表情 :smiley:

Blockquotes :star:

GFM task lists & Emoji & fontAwesome icon emoji & editormd logo emoji :editormd-logo-5x:

反斜杠 Escape

*literal asterisks*

[========]

科学公式 TeX(KaTeX)

$$E=mc^2$$

行内的公式$$E=mc^2$$行内的公式,行内的$$E=mc^2$$公式。

$$x > y$$

$$(\sqrt{3x-1}+(1+x)^2)$$

$$\sin(\alpha)^{\theta}=\sum_{i=0}^{n}(x^i + \cos(f))$$

多行公式:

\displaystyle
\left( \sum\_{k=1}^n a\_k b\_k \right)^2
\leq
\left( \sum\_{k=1}^n a\_k^2 \right)
\left( \sum\_{k=1}^n b\_k^2 \right)
\displaystyle
    \frac{1}{
        \Bigl(\sqrt{\phi \sqrt{5}}-\phi\Bigr) e^{
        \frac25 \pi}} = 1+\frac{e^{-2\pi}} {1+\frac{e^{-4\pi}} {
        1+\frac{e^{-6\pi}}
        {1+\frac{e^{-8\pi}}
         {1+\cdots} }
        }
    }
f(x) = \int_{-\infty}^\infty
    \hat f(\xi)\,e^{2 \pi i \xi x}
    \,d\xi

分页符 Page break

Print Test: Ctrl + P

[========]

绘制流程图 Flowchart

ap=>start: Application Layer(http)
pl=>operation: Presentation Layer(File type)
sl=>operation: Session Layer(Tsl)
tsl=>operation: Transport&Session Layer(TCP)
nl=>operation: Internet Layer(IP)
dll=>operation: Data Link Layer(以太网)
psl=>operation: Psysical Layer(Cable/wifi)
e=>end: 通过介质进行传输

ap->pl->sl->tsl->nl->dll->psl->e

[========]

绘制序列图 Sequence Diagram

Browser->DNS Server: what's ip of this Domain name
DNS Server->Browser: that Domain name's ip: 234.2.22.33
Browser->Web Server(234.2.22.33): Open TCP Connection
Browser->Web Server(234.2.22.33):Request web page(where the http comes in)
Web Server(234.2.22.33)->Browser:home page or redirect
Note left of Browser:process returned request
Browser->Web Server(234.2.22.33):request other resources(css/js/images)
Web Server(234.2.22.33)->Browser:return other resources(css/js/images)
Note left of Browser: browser has enough critical resource\n so start to render web page
Browser->Web Server(234.2.22.33):request other resources(css/js/images)
Web Server(234.2.22.33)->Browser:return other resources(css/js/images)
Note left of Browser:Onload Event
Browser->Web Server(234.2.22.33):request other resources(css/js/images)
Web Server(234.2.22.33)->Browser:return other resources(css/js/images)

End