在Ajax出現之前，網頁與服務的通信通常是通過頁面的刷新或者重定向來實現的。這種方式會導致用戶體驗不佳，因為用戶需要等待頁面加載完成才能看到更新的內容。然而，隨著Ajax的出現，這個問題得到了解決，可以實現與服務的異步通信，從而提高用戶體驗。

舉個例子來說明，在一個在線購物網站上，用戶在瀏覽商品列表時，想要查看某個商品的詳細信息。在Ajax出現之前，用戶點擊商品鏈接后，頁面會發生刷新或者重定向的操作，導致用戶暫時離開商品列表頁面，等待新頁面加載完成。而通過Ajax，用戶點擊商品鏈接后，可以在不離開商品列表頁面的情況下實現商品詳細信息的加載。

具體的實現過程如下：

// HTML
<div id="product-details"></div>
<a href="#" onclick="loadProductDetails(productId)">Product Link</a>
// JavaScript
function loadProductDetails(productId) {
var httpRequest = new XMLHttpRequest();
httpRequest.onreadystatechange = function() {
if (httpRequest.readyState === 4 && httpRequest.status === 200) {
document.getElementById("product-details").innerHTML = httpRequest.responseText;
}
};
httpRequest.open("GET", "/api/product/" + productId, true);
httpRequest.send();
}

上述代碼通過JavaScript中的XMLHttpRequest對象實現了與服務的通信。當用戶點擊"Product Link"鏈接時，觸發loadProductDetails函數，該函數會創建一個XMLHttpRequest對象，然后通過該對象發送一個GET請求到服務器。服務器返回的數據會在XMLHttpRequest對象的onreadystatechange事件中進行處理，當readyState變為4且status為200時，說明已成功接收到服務器返回的數據。然后在頁面中的"product-details"容器中渲染商品詳細信息。

Ajax技術的出現極大地提升了用戶體驗，因為用戶可以在不離開當前頁面的情況下與服務進行通信，快速獲取所需內容。除了網頁與服務的通信，Ajax還廣泛應用于各種在線應用中，例如社交媒體的實時消息更新、搜索引擎的自動補全提示等等。

雖然Ajax已經成為網頁開發的常用技術，但它也存在一些問題。比如，Ajax請求可能會增加服務器的負載，因為服務器需要處理大量的異步請求。此外，Ajax也會增加前端開發的復雜性，需要處理錯誤和超時等情況。但總體來說，Ajax的出現是對網頁與服務通信方式的一次革命性改進，極大地提升了用戶體驗。