Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
Feature Requests
FAQ
Register
Log In
XHR vs fetch vs axios to tronscan
(version: 0)
Benchmark.js
Comparing performance of:
xhr vs fetch vs axios
Created:
4 years ago
by:
Guest
Go to the latest result
HTML Preparation code:
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
Tests:
xhr
const xhr = new XMLHttpRequest(); xhr.open('GET', 'https://apilist.tronscan.org/api/account?address=TWaSm8dnvTdJQ9hcpW3g8m4QEfJspcuDwA'); xhr.onload = () => console.log(JSON.parse(xhr.responseText)); xhr.send();
fetch
fetch('https://apilist.tronscan.org/api/account?address=TWaSm8dnvTdJQ9hcpW3g8m4QEfJspcuDwA') .then(response => response.json()) .then(console.log)
axios
axios.get('https://apilist.tronscan.org/api/account?address=TWaSm8dnvTdJQ9hcpW3g8m4QEfJspcuDwA') .then((response) => response.json()) .then(console.log);
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (3)
Previous results
Fork
Test case name
Result
xhr
fetch
axios
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
one year ago
)
User agent:
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/17.5 Safari/605.1.15
Browser/OS:
Safari 17 on Mac OS X 10.15.7
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=558064" width="100%" height="500px"></iframe>
xhr
258K/s
fetch
64K/s
axios
42K/s
View exact numbers
Test name
Executions per second
✓
xhr
258,033 Ops/sec
fetch
63,989 Ops/sec
axios
42,107 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
**Benchmark Overview** The provided JSON represents a JavaScript microbenchmarking test case on the MeasureThat.net website. The benchmark compares the performance of three different approaches: XMLHttpRequest (XHR), Fetch API, and Axios to make a request to the Tronscan API. **What is being tested?** The test case is designed to measure the execution time of each approach in making a GET request to the specified URL. In this specific case, the request is to retrieve information about a Tron account. **Options compared:** 1. **XMLHttpRequest (XHR)**: An older JavaScript API for making HTTP requests. 2. **Fetch API**: A newer JavaScript API introduced in ECMAScript 2015 for making HTTP requests. 3. **Axios**: A popular third-party library for making HTTP requests, built on top of the Fetch API. **Pros and Cons of each approach:** 1. **XHR (XMLHttpRequest)**: * Pros: Well-established API, widely supported by older browsers. * Cons: Can be slower due to its older implementation and additional overhead for configuration. 2. **Fetch API**: * Pros: Modern and efficient, built into the browser's JavaScript engine, allows for easier cancellation of requests. * Cons: Requires modern browsers (>= Chrome 39, Firefox 33) to work. 3. **Axios**: * Pros: High-level abstraction over the Fetch API, built-in support for promises and async/await syntax, more extensive documentation and community support. * Cons: Adds an external library dependency, can be slower due to its additional overhead. **Library usage** In this benchmark, Axios is used as a third-party library to make HTTP requests. Axios provides a simpler and more efficient way of making requests compared to the Fetch API or XHR. **Special JS features or syntax** None are mentioned in this specific benchmark. **Other considerations** * MeasureThat.net provides various options for customizing benchmarks, such as adjusting the number of iterations, test environment, and browser settings. * The benchmark results are displayed on a graph, allowing users to easily compare the performance of each approach. * Users can also view detailed statistics about each test case, including execution time, number of executions per second, and more. **Alternatives** Other alternatives for making HTTP requests in JavaScript include: 1. **jQuery.ajax()**: A part of the jQuery library, providing a simple way to make AJAX requests. 2. **WinHttp.WinHttpRequest4**: An older API from Microsoft's Internet Explorer browser, not recommended due to its slow performance and limited features. Keep in mind that these alternatives may have different performance characteristics compared to XHR, Fetch API, and Axios.
Related benchmarks
Lodash cloneDeep vs structuredClone vs JSON.stringify/parse
Lodash cloneDeep vs structuredClone vs JSON parse/stringify
Comments
Confirm delete:
Do you really want to delete benchmark?