学习

使用PaperMode

地址 #

官方: https://github.com/adityatelange/hugo-PaperMod/wiki/Installation (有些东西没有同hugo官方同步) 非官方: https://github.com/vanitysys28/hugo-papermod-wiki/blob/master/Home.md (与hugo官方更同步)

安装 #

hugo new site blog.source --format yaml
cd blog.source
git init
git submodule add --depth=1 https://github.com/adityatelange/hugo-PaperMod.git themes/PaperMod 
git submodule update --init --recursive # needed when you reclone your repo (submodules may not get cloned automatically) 
git submodule update --remote --merge

hugo进阶学习20-23

DateFiles #

{% raw %} 
{
  "classA":"json位置: data\\classes.json",
  "classA":{
    "master":"xiaoLi",
    "number":"05"
  },
  "classB":{
    "master":"aXiang",
    "number":"15"
  },
  "classC":{
    "master":"BaoCeng",
    "number":"20"
  }
}  
{% endraw %} 

模板代码

{% raw %} 
{{/* layouts\_default\single.html */}}
{{ define "main" }}
     {{ range .Site.Data.classes }}
          master:{{.master}}==number:{{.number}}<br>
     {{end}}
{{end}} 
{% endraw %} 

PartialTemplates #

传递全局范围 #

{% raw %} 
{{/*layouts\partials\header.html*/}}
<h1>{{.Title}}</h1>
<p>{{.Date}}</p> 
{% endraw %} 
{% raw %} 
{{/*layouts\_default\single.html*/}}
{{ define "main" }}
  {{ partial "header" . }}
  {{/*点.传递了当前文件的范围,代表了所有的范围,所有可以访问的变量*/}}
  <hr>
{{end}} 
{% endraw %} 

预览:

...

hugo进阶学习17-19

Variable #

文件结构 #

实战 #

{% raw %} 
{{/*layouts\_default\single.html*/}}
{{ define "main" }}
  This is the single template<br>
  {{/* 常见变量 */}}
   title: {{ .Params.title }}<br>
   title: {{   .Title }}<br>
   date: {{ .Date }}<br>
  url: {{ .URL }}<br>
  myvar: {{ .Params.myVar }}<br>
  {{/* 定义变量 */}}
  {{ $myVarname := "aString" }}
  myVarname:{{ $myVarname }}<br>
  <h1 style="color: {{ .Params.color }} ;" >Single Template</h1>
{{ end }}  
{% endraw %} 
{% raw %} 
---
title: "E-title"
date: 2024-12-07T12:43:21+08:00
draft: true
myVar: "myvalue"
color: "red"
---

This is dir3/e.md 
{% endraw %} 

...

hugo进阶学习11-15

这里使用的版本是v0.26(很久之前的版本)

template basic #

模板分为list template和single template

文件夹结构 #

content目录结构

list template (列表模板) #

single template (单页模板) #

特点 #

所有的列表之间都是长一样的(页眉,页脚,及内容(都是列表))
所有的单页之间都是长一样的(一样的页眉页脚,一样的内容布局)

部分代码解释 #

单页探索 #


list page templates #

文件夹结构 #

文件内容 #

#content/_index
---
title: "_Index" 
---

This is the home page
#content/dir1/_index
---
title: "_Index"
---

This is the landing page for dir1

当前效果 #

...

hugo进阶学习01-10

系列视频地址介绍
https://www.youtube.com/watch?v=qtIqKaDlqXo&list=PLLAZ4kZ9dFpOnyRlyS-liKL5ReHDcj4G3

介绍 #

  • hugo是用来构建静态网站的
  • 但是也可以稍微做点动态生成的事
  • 这里使用的版本是v0.26(很久之前的版本)

备注:标题短代码之前(不包括短代码这篇)的笔记是回溯的,所以没有复制源代码下来,直接在视频再次截图的

在Windows上安装hugo #

  • 到github release下载,然后放到某个文件夹中
  • 设置环境变量
  • 验证环境变量
  • 最后验证hugo版本
hugo version

创建一个新的网站 #

  • 使用代码生成
hugo new site
  • 文件夹结构

使用主题 #

这里是https://themes.gohugo.io
这里使用的是ga-hugo-theme(github中查找),并放到themes文件夹中

之后在config.toml中使用主题

baseURL = "http://example.org/"
languageCode = "en-us"
title = "My New Hugo Site"
theme = "ga-hugo-theme" #添加这句话
  • 启动博客
    hugo serve
  • 地址
    localhost:1313

创建md文件 #

  • 使用hugo new a.md把文件创建在content/a.md或者hugo new dir2/d.md把文件创建在content/dir2.md下,这讲创建后的结构目录为
    • 总共5个文件,可以使用localhost:1313访问博客(默认列举所有(包括子文件夹)文件
    • 可以使用 localhost:1313/dir3访问dir3下所有文件列表(list),localhost:1313/dir1访问dir1下所有文件列表 (都是content的直接子文件夹)
    • 如果没有dir1/dir2/_index.md这个文件 ,则不能直接使用localhost:1313/dir1/dir2访问dir1/dir2下所有文件
    • 查看dir1/dir2/index.md文件及效果

frontmatter (前言) #

  • 可以使用YAML,TOML,或者JSON
  • md编码及效果

archetypes(原型) #

默认的原型文件 #

archetypes/default.md

...

border-theme背景图片问题

svg格式作为背景图片(简单图片可行) #

以下面这张图片为例
最简单的方式,用记事本/文本编辑器,打开svg图片,全选,复制,即

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1920 1080"><g transform="
          rotate(0 960 540) 
          translate(-0 -0)
          scale(1)
        "><rect width="1920" height="1080" fill="rgb(184, 171, 255)"></rect><g transform="translate(0, 0)"><path fill="rgb(131, 114, 218)" fill-opacity="1" d="M0,352.943L45.714,350.075C91.429,347.207,182.857,341.471,274.286,340.581C365.714,339.692,457.143,343.65,548.571,344.095C640,344.54,731.429,341.472,822.857,303.183C914.286,264.894,1005.714,191.383,1097.143,185.175C1188.571,178.967,1280,240.06,1371.429,221.336C1462.857,202.612,1554.286,104.069,1645.714,98.48C1737.143,92.892,1828.571,180.258,1874.286,223.941L1920,267.624L1920,1080L1874.286,1080C1828.571,1080,1737.143,1080,1645.714,1080C1554.286,1080,1462.857,1080,1371.429,1080C1280,1080,1188.571,1080,1097.143,1080C1005.714,1080,914.286,1080,822.857,1080C731.429,1080,640,1080,548.571,1080C457.143,1080,365.714,1080,274.286,1080C182.857,1080,91.429,1080,45.714,1080L0,1080Z"></path></g><g transform="translate(0, 360)"><path fill="rgb(79, 57, 180)" fill-opacity="1" d="M0,136.093L45.714,117.434C91.429,98.774,182.857,61.455,274.286,80.719C365.714,99.983,457.143,175.829,548.571,189.505C640,203.181,731.429,154.687,822.857,130.414C914.286,106.141,1005.714,106.09,1097.143,141.274C1188.571,176.458,1280,246.877,1371.429,284.697C1462.857,322.517,1554.286,327.739,1645.714,284.675C1737.143,241.611,1828.571,150.263,1874.286,104.589L1920,58.914L1920,720L1874.286,720C1828.571,720,1737.143,720,1645.714,720C1554.286,720,1462.857,720,1371.429,720C1280,720,1188.571,720,1097.143,720C1005.714,720,914.286,720,822.857,720C731.429,720,640,720,548.571,720C457.143,720,365.714,720,274.286,720C182.857,720,91.429,720,45.714,720L0,720Z"></path></g><g transform="translate(0, 720)"><path fill="rgb(26, 0, 143)" fill-opacity="1" d="M0,107.121L45.714,134.307C91.429,161.493,182.857,215.866,274.286,254.33C365.714,292.794,457.143,315.35,548.571,300.514C640,285.679,731.429,233.452,822.857,180.313C914.286,127.174,1005.714,73.123,1097.143,43.365C1188.571,13.606,1280,8.141,1371.429,41.079C1462.857,74.017,1554.286,145.358,1645.714,167.782C1737.143,190.206,1828.571,163.713,1874.286,150.467L1920,137.221L1920,360L1874.286,360C1828.571,360,1737.143,360,1645.714,360C1554.286,360,1462.857,360,1371.429,360C1280,360,1188.571,360,1097.143,360C1005.714,360,914.286,360,822.857,360C731.429,360,640,360,548.571,360C457.143,360,365.714,360,274.286,360C182.857,360,91.429,360,45.714,360L0,360Z"></path></g></g></svg>

之后打开https://codepen.io/yoksel/details/MWKeKK 网站,在 Insert your SVG中粘贴,得到

最后把url("") 这块复制【没有分号】,即

url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1920 1080"%3E%3Cg transform=" rotate(0 960 540) translate(-0 -0) scale(1) "%3E%3Crect width="1920" height="1080" fill="rgb(184, 171, 255)"%3E%3C/rect%3E%3Cg transform="translate(0, 0)"%3E%3Cpath fill="rgb(131, 114, 218)" fill-opacity="1" d="M0,352.943L45.714,350.075C91.429,347.207,182.857,341.471,274.286,340.581C365.714,339.692,457.143,343.65,548.571,344.095C640,344.54,731.429,341.472,822.857,303.183C914.286,264.894,1005.714,191.383,1097.143,185.175C1188.571,178.967,1280,240.06,1371.429,221.336C1462.857,202.612,1554.286,104.069,1645.714,98.48C1737.143,92.892,1828.571,180.258,1874.286,223.941L1920,267.624L1920,1080L1874.286,1080C1828.571,1080,1737.143,1080,1645.714,1080C1554.286,1080,1462.857,1080,1371.429,1080C1280,1080,1188.571,1080,1097.143,1080C1005.714,1080,914.286,1080,822.857,1080C731.429,1080,640,1080,548.571,1080C457.143,1080,365.714,1080,274.286,1080C182.857,1080,91.429,1080,45.714,1080L0,1080Z"%3E%3C/path%3E%3C/g%3E%3Cg transform="translate(0, 360)"%3E%3Cpath fill="rgb(79, 57, 180)" fill-opacity="1" d="M0,136.093L45.714,117.434C91.429,98.774,182.857,61.455,274.286,80.719C365.714,99.983,457.143,175.829,548.571,189.505C640,203.181,731.429,154.687,822.857,130.414C914.286,106.141,1005.714,106.09,1097.143,141.274C1188.571,176.458,1280,246.877,1371.429,284.697C1462.857,322.517,1554.286,327.739,1645.714,284.675C1737.143,241.611,1828.571,150.263,1874.286,104.589L1920,58.914L1920,720L1874.286,720C1828.571,720,1737.143,720,1645.714,720C1554.286,720,1462.857,720,1371.429,720C1280,720,1188.571,720,1097.143,720C1005.714,720,914.286,720,822.857,720C731.429,720,640,720,548.571,720C457.143,720,365.714,720,274.286,720C182.857,720,91.429,720,45.714,720L0,720Z"%3E%3C/path%3E%3C/g%3E%3Cg transform="translate(0, 720)"%3E%3Cpath fill="rgb(26, 0, 143)" fill-opacity="1" d="M0,107.121L45.714,134.307C91.429,161.493,182.857,215.866,274.286,254.33C365.714,292.794,457.143,315.35,548.571,300.514C640,285.679,731.429,233.452,822.857,180.313C914.286,127.174,1005.714,73.123,1097.143,43.365C1188.571,13.606,1280,8.141,1371.429,41.079C1462.857,74.017,1554.286,145.358,1645.714,167.782C1737.143,190.206,1828.571,163.713,1874.286,150.467L1920,137.221L1920,360L1874.286,360C1828.571,360,1737.143,360,1645.714,360C1554.286,360,1462.857,360,1371.429,360C1280,360,1188.571,360,1097.143,360C1005.714,360,914.286,360,822.857,360C731.429,360,640,360,548.571,360C457.143,360,365.714,360,274.286,360C182.857,360,91.429,360,45.714,360L0,360Z"%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E')

加上

...

obsidian-theme

主题推荐 #

  1. Neumorphism-dark.json

  2. Sunset-base64.json ✔

  3. Obsidian-default-dark-alt ✔
    4. Obsidian-default-light-alt

  4. Neumorphism.json

  5. eyefriendly ✔

  6. boundy ✔ flexoki-light Borderless-light

关于obsidian主题border的背景图片设置 #

配合StyleSettings,在StyleSettings的这里设置

暂不明确 #

background中貌似存在转换规则,不是直接用url("")这个形式把图片base64放进来就可以了,目前觉得可能的转换规则

%3c 48+12=60  <
%3e 48+14=62   >
%23 32+3=35    #  
#下面的好像没用到,也不确定
%2b  32+11=43  + 
%3b ;
%2c ,

后续见另一篇文章
border-theme {% post_link ‘study/obsidian/border-theme’ ‘helo’ %}

03垃圾收集器与内存分配策略

学习《深入理解Java虚拟机》,感谢作者!

代码清单3-9 -XX:MaxTenuringThreshod=1说明 #

Eden[8M]Survivor1[1M]Survivor2[1M]Old {10M}
初始allocation1[0.25M],allocation2[4MB]
3执行时gc导致的变化+allocation1[0.25M]+allocation2[4MB]
3执行后+allocation3[4MB]+allocation1[0.25M]+allocation2[4MB]
5执行时gc导致的变化allocation2[4MB],+allocation1[0.25M]
5执行后+allocation3[4MB]allocation2[4MB],+allocation1[0.25M]

代码清单3-9 -XX:MaxTenuringThreshod=15说明 #

Eden[8M]Survivor1[1M]Survivor2[1M]Old {10M}
初始allocation1[0.25M],allocation2[4MB]
3执行时gc导致的变化+allocation1[0.25M]+allocation2[4MB]
3执行后+allocation3[4MB]+allocation1[0.25M]+allocation2[4MB]
5执行时gc导致的变化+allocation1[0.25M]allocation2[4MB]
5执行后+allocation3[4MB]+allocation1[0.25M]allocation2[4MB],+allocation1[0.25M]

代码清单3-10 说明 #

Eden[8M]Survivor1[1M]Survivor2[1M]Old {10M}
初始allocation1[0.25M],
allocation2[[0.25M],allocation3[4M]
4执行时gc导致的变化+allocation1[0.25M],
+allocation2[[0.25M],
+allocation3[4MB]
4执行后+allocation4[4MB]+allocation1[0.25M],
+allocation2[[0.25M],
+allocation3[4MB]
6执行时gc导致的变化allocation3[4MB],
+allocation1[0.25M],
+allocation2[[0.25M],
6执行后+allocation4[4MB]allocation3[4MB],
+allocation1[0.25M],
+allocation2[[0.25M],

代码清单3-11 说明 #

-XX:-HandlePromotionFailure 关 #

Eden[8M]Survivor1[1M]Survivor2[1M]Old {10M}
初始allocation1[2M],
allocation2[2M],
allocation3[2M]
allocation1[null],allocation4[2M]
5执行时gc导致的变化+allocation2[2M],+allocation3[2M] //总共4M
5执行后+allocation4[2M]+allocation2[2M],+allocation3[2M] //总共4M
6->11allocation4[2M]
+allocation5[2M],
+allocation6[2M]
allocation2[2M],
allocation3[2M] //总共4M,
此时老年代连续可用空间在6M(或者说小于6M)
11执行时gc导致的变化allocation3[4MB],
+allocation1[0.25M],
+allocation2[[0.25M],
11执行后+allocation7[2MB]allocation3[4MB],
+allocation1[0.25M],
+allocation2[[0.25M],

说明 #

  1. 书籍版权归著者和出版社所有

    ...

07B+数索引的使用

学习《MySQL是怎样运行的》,感谢作者!

InnoDB存储引擎的B+树索引:结论 #

  • 每个索引对应一颗B+树。B+树有好多层,最下边一层叶子节点,其余是内节点。所有用户记录都存在B+树的叶子节点,所有目录项记录都存在内节点
  • InnoDB 存储引擎会自动为主键建立聚簇索引(如果没有显式指定主键或者没有声明不允许存储NULL的UNIQUE 键,它会自动添加主键) , 聚簇索引叶子节点包含完整的用户记录
  • 我们可以为感兴趣的列建立二级索引,二级索引的叶子节点包含的用户记录由索引列 和主键组成。如果想通过二级索引查找完整的用户记录,需要执行回表操作, 也就是在通过二级索引找到主键值之后,再到聚簇索引中查找完整的用户记录
  • B+ 树中的每层节点都按照索引列的值从小到大的顺序排序组成了双向链表,而且每个页内的记录(无论是用户记录还是目录项记录)都按照索引列的值从小到大的顺序形成了一个单向链表。如果是联合索引, 则页面记录 按照索引列中前面的列的值排序:如果该列的值相同再按照索引列中后面的列的值排序。比如, 我们对列c2 和c3建立了联合索引 idx_c2_c3(c2, c3),那么该索引中的页面和记录就先按照c2 列的值进行排序;如果c2 列的值相同再按照c3 列的值排序
  • 通过索引查找记录时,是从B+ 树的根节点开始一层一层向下搜索的。由于每个页面(无论是内节点页面还是叶子节点页面〉中的记录都划分成了若干个组, 每个组中索引列值最大的记录页内的偏移量会被当作依次存放在页目录中(当然, 规定Supremum 记录比任何用户记录都大) ,因此可以在页目录中通过二分法快速定位到索引列等于某个值的记录

如果大家在阅读上述结论时哪怕有点疑惑, 那么下面的内容就不适合你,请回过头去反复阅读前面的章节

B+树索引示意图的简化 #

#创建新表
mysql> CREATE TABLE single_table(
      id INT NOT NULL AUTO_INCREMENT,
      key1 VARCHAR(100),
      key2 INT,
      key3 VARCHAR(100),
      key_part1 VARCHAR(100),
      key_part2 VARCHAR(100),
      key_part3 VARCHAR(100),
      common_field VARCHAR(100),
      PRIMARY KEY (id),
      KEY idx_key1(key1),
      UNIQUE KEY uk_key2(key2),
      KEY idx_key3(key3),
      KEY idx_key_part(key_part1,key_part2,key_part3)
      ) Engine=InnoDB CHARSET = utf8;

如上,建立了1个聚簇索引4个二级索引

...