無限スクロールのスケルトン読み込み

<div class="d11-10-06-wrap">
          <div class="d11-10-06-scroll" id="d1466Scroll">
            <ul class="d11-10-06-list" id="d1466List">
              <li>ニュース: 新サービス開始のお知らせ</li>
              <li>ニュース: イベント開催決定</li>
              <li>ニュース: サイトリニューアル情報</li>
            </ul>
            <div class="d11-10-06-sentinel" id="d1466Sentinel"></div>
          </div>
          <p class="d11-10-06-hint">▼ スクロールでスケルトン→本文表示</p>
        </div>

.prev.d11-10-06{align-items:flex-start;justify-content:flex-start}
        .d11-10-06-wrap{width:100%}
        .d11-10-06-scroll{height:200px;overflow-y:auto;border-radius:12px;background:#f8f9fb;border:1px solid #eef0f3;padding:8px}
        .d11-10-06-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:7px}
        .d11-10-06-list li{background:#fff;border:1px solid #eef0f3;border-radius:8px;padding:9px 11px;font-size:11.5px;color:#374151}
        .d11-10-06-sentinel{height:1px}
        .d11-10-06-skel{height:33px;border-radius:8px;margin-top:7px;background:linear-gradient(90deg,#eef0f3 25%,#f3f4f6 37%,#eef0f3 63%);background-size:300px 100%;animation:d1466Shimmer 1.1s linear infinite}
        @keyframes d1466Shimmer{0%{background-position:-150px 0}100%{background-position:250px 0}}
        .d11-10-06-hint{margin:8px 0 0;font-size:10.5px;color:#9ca3af;text-align:center}

(function(){
        var root=document.getElementById('item-11-10-06');
        var scroll=root.querySelector('#d1466Scroll');
        var list=root.querySelector('#d1466List');
        var sentinel=root.querySelector('#d1466Sentinel');
        var n=3,max=13,busy=false;
        var topics=['地域限定キャンペーン開始','会員向けアンケート実施中','新しいコラムを公開しました','よくある質問を更新','スタッフインタビュー掲載'];
        if(!('IntersectionObserver' in window))return;
        var io=new IntersectionObserver(function(entries){
          entries.forEach(function(entry){
            if(entry.isIntersecting&&!busy&&n<max){
              busy=true;
              var skels=[];
              for(var s=0;s<2;s++){
                var sk=document.createElement('div');
                sk.className='d11-10-06-skel';
                list.parentNode.insertBefore(sk,sentinel);
                skels.push(sk);
              }
              setTimeout(function(){
                skels.forEach(function(sk){sk.remove();});
                for(var i=0;i<2&&n<max;i++){
                  n++;
                  var li=document.createElement('li');
                  li.textContent='ニュース: '+topics[n%topics.length];
                  list.appendChild(li);
                }
                busy=false;
                if(n>=max)io.unobserve(sentinel);
              },750);
            }
          });
        },{root:scroll,threshold:0.01});
        io.observe(sentinel);
      })();