回答：

異步加載和延遲加載是前端優(yōu)化網(wǎng)站性能的兩種方法。

異步加載的方案:

動(dòng)態(tài)插入script標(biāo)簽

通過(guò)ajax去獲取js代碼，然后通過(guò)eval執(zhí)行

script標(biāo)簽上添加defer或者async屬性創(chuàng)建并插入iframe，讓它異步執(zhí)行js

延遲加載：

有些 js 代碼并不是頁(yè)面初始化的時(shí)候就立刻需要的，而稍后的某些情況才需要的。

細(xì)說(shuō)：

異步加載指的是在頁(yè)面加載完成之后，通過(guò)JavaScript異步請(qǐng)求數(shù)據(jù)或資源，來(lái)避免阻塞頁(yè)面的加載。常用的實(shí)現(xiàn)方式是使用XMLHttpRequest對(duì)象或fetch API發(fā)起異步請(qǐng)求，然后通過(guò)回調(diào)函數(shù)或Promise來(lái)處理請(qǐng)求結(jié)果。

異步加載可以提高頁(yè)面的響應(yīng)速度和用戶體驗(yàn)，但也可能會(huì)增加頁(yè)面的復(fù)雜度和維護(hù)成本。

延遲加載指的是將頁(yè)面中不必要的資源（如圖片、音頻、視頻等）的加載推遲到用戶需要訪問(wèn)它們的時(shí)候再進(jìn)行加載。

常用的實(shí)現(xiàn)方式是使用懶加載技術(shù)，即使用JavaScript來(lái)監(jiān)聽(tīng)頁(yè)面滾動(dòng)或用戶操作等事件，然后根據(jù)需要來(lái)動(dòng)態(tài)加載資源。延遲加載可以減少頁(yè)面的加載時(shí)間和帶寬消耗，提高網(wǎng)站的性能和用戶體驗(yàn)。

需要注意的是，異步加載和延遲加載并不是互斥的關(guān)系，它們可以結(jié)合使用來(lái)進(jìn)一步優(yōu)化網(wǎng)站的性能。

例如，在頁(yè)面加載時(shí)可以先異步加載必要的腳本和樣式文件，然后在用戶需要訪問(wèn)資源時(shí)再進(jìn)行延遲加載。

實(shí)例

異步加載：

使用XMLHttpRequest對(duì)象或fetch API發(fā)起異步請(qǐng)求，例如：

const xhr = new XMLHttpRequest();
xhr.open('GET', 'https://example.com/data.json');
xhr.onload = function() {
  if (xhr.status === 200) {
    const data = JSON.parse(xhr.responseText);
    // 處理請(qǐng)求結(jié)果
  } else {
    console.error('請(qǐng)求失敗');
  }
};
xhr.send();

使用Promise來(lái)處理異步請(qǐng)求，例如：

fetch('https://example.com/data.json')
  .then(response => response.json())
  .then(data => {
    // 處理請(qǐng)求結(jié)果
  })
  .catch(error => {
    console.error('請(qǐng)求失敗', error);
  });

使用async/await來(lái)處理異步請(qǐng)求，例如：

async function fetchData() {
  try {
    const response = await fetch('https://example.com/data.json');
    const data = await response.json();
    // 處理請(qǐng)求結(jié)果
  } catch (error) {
    console.error('請(qǐng)求失敗', error);
  }
}
fetchData();

使用Intersection Observer API來(lái)監(jiān)聽(tīng)頁(yè)面滾動(dòng)事件，例如：

const images = document.querySelectorAll('img[data-src]');
const observer = new IntersectionObserver(entries => {
  entries.forEach(entry => {
    if (entry.isIntersecting) {
      const image = entry.target;
      image.src = image.dataset.src;
      observer.unobserve(image);
    }
  });
});
images.forEach(image => {
  observer.observe(image);
});

使用圖片占位符來(lái)減少頁(yè)面的抖動(dòng)，例如：

<img src="placeholder.jpg" data-src="image.jpg" width="300" height="200">

使用懶加載庫(kù)來(lái)實(shí)現(xiàn)延遲加載，例如：

// 使用jQuery Lazy加載庫(kù)
$("img.lazy").lazy({
  effect: "fadeIn",
  threshold: 200
});

以上是異步加載和延遲加載的一些具體實(shí)例，實(shí)際上還有很多其他的實(shí)現(xiàn)方式，需要根據(jù)具體情況來(lái)選擇。