position: sticky簡(jiǎn)析
position:sticky粘性吸附布局，過(guò)渡平滑，效果棒，移動(dòng)端網(wǎng)頁(yè)可優(yōu)先使用，不失為懸浮導(dǎo)航的理想之選。相比其它的定位屬性，相對(duì)復(fù)雜，sticky是否生效，同時(shí)依賴祖先元素。
布局位置跟sticky元素在文檔中的static位置和“最近可滾動(dòng)元素”、“最近的包含塊元素”的交叉區(qū)域有關(guān)。最近的可滾動(dòng)元素（overflow設(shè)置為非visible，沒(méi)有則為視窗）、最近的包含塊元素（塊級(jí)元素或新建BFC上下文的元素）
當(dāng)發(fā)現(xiàn)sticky無(wú)效時(shí)，可先確認(rèn)一下：
1、祖先元素中是否設(shè)置了非visible值的overflow規(guī)則；
2、識(shí)別交叉區(qū)域?；九袛嗟脑?，垂直滾動(dòng)，交叉區(qū)域底部應(yīng)該和滾動(dòng)元素的底部一致。
計(jì)算規(guī)則理解參考文章：
https://www.zhangxinxu.com/wordpress/2020/03/position-sticky-rules/
https://github.com/w3c/csswg-drafts/issues/865
對(duì)比一下，原先一般通過(guò)監(jiān)聽(tīng)滾動(dòng)事件，調(diào)整導(dǎo)航布局為fixed的方式，但還得考慮保持原來(lái)導(dǎo)航的高度，通過(guò)設(shè)置邊距或復(fù)制一個(gè)導(dǎo)航占位來(lái)處理，避免跳動(dòng)。
滾動(dòng)體驗(yàn)小優(yōu)化，應(yīng)用scroll-snap-align指定滾動(dòng)結(jié)束時(shí)的停留點(diǎn)。比如水平導(dǎo)航可優(yōu)化，滾動(dòng)后顯示完整右側(cè)導(dǎo)航項(xiàng)。
.nav-list {overflow-x: auto; scroll-snap-type: x mandatory;}.nav-list-item {scroll-snap-align: end;}
跨境網(wǎng)站使用branch進(jìn)行統(tǒng)計(jì)歸因比較常見(jiàn)，配置journey引流廣告，僅當(dāng)存在某個(gè)meta值不匹配某值才顯示banner，目前必須確保該meta存在且值不為空才有效。
git合并分支部分提交記錄時(shí)，可使用git cherry-pick <commitHash值>命令。
基于漸進(jìn)增強(qiáng)的原則，可以在項(xiàng)目中使用aspect-ratio事先指定replaced元素（如圖片）的寬高比，避免渲染時(shí)的布局跳動(dòng)，提升用戶體驗(yàn)。
cookieStore，一個(gè)新的瀏覽器原生API，操作cookie的一種替代方式，基于promise的異步形式，提供了便捷方法操作cookie，同時(shí)在serviceWorker中也可以訪問(wèn)，未來(lái)應(yīng)該會(huì)得到更多主流瀏覽器廠商支持。