Hoe kan ik Javascript profileren nu JSPerf niet beschikbaar is?

Zoals sommigen van jullie waarschijnlijk hebben opgemerkt, is jsperfal enige tijd niet beschikbaar. Maar ik moet mijn Javascripts nog profileren. Is er een mogelijkheid om vergelijkingstests te doen, idealiter zonder de hulp van externe software?


Antwoord 1, autoriteit 100%

jsperf is gebaseerd op benchmarkjsen gebruikt dus een online code-editor (zoals jsfiddle, jsbin, plunkerenz…) en het opnemen van benchmarkjs als bibliotheek is voldoende.

De enige functie die u niet zult hebben, zijn de gecompileerde resultaten voor elke browser. Dit is slechts een tijdelijk alternatief.

Hier is een jsfiddle-sjabloon: https://jsfiddle.net/533hc71h/

Maar aangezien we niet echt om HTML of CSS geven, vond ik plunker geschikter. In combinatie met systemjskun je je code vervolgens scheiden in meerdere bestanden.

Hier is de sjabloon: https://plnkr.co/edit/pJg5LsiSNqlc6immmGsW


Bijwerken

Je zou die oplossing eigenlijk alleen moeten gebruiken als snelle tijdelijke oplossing. Zoals gezegd in de opmerkingen voor een optimaal resultaat kun je het beter lokaal uitvoeren, tegenwoordig kun je een webserver zoals express krijgen of anders in een oogwenk draaien.


Laten we in plaats van Stack Overflow het plaatsen van deze links toe te staan, wat nuttige code toevoegen:

function test1() {
}
function test2() {
}
var cycleResults = document.getElementById('cycleResults');
var result = document.getElementById('result');
var btn = document.getElementById('btn');
// BENCHMARK ====================
btn.onclick = function runTests() {
  btn.setAttribute('disable', true);
  cycleResults.innerHTML = '';
  result.textContent = 'Tests running...';
  var suite = new Benchmark.Suite;
  // add tests
  suite
    .add('test1', test1)
    .add('test2', test2)
    // add listeners
    .on('cycle', function(event) {
      var result = document.createElement('li');
      result.textContent = String(event.target);
      document.getElementById('cycleResults')
        .appendChild(result);
    })
    .on('complete', function() {
      result.textContent = 'Fastest is ' + this.filter('fastest').pluck('name');
      btn.setAttribute('disable', false);
    })
    // run async
    .run({
      'async': true
    });
};
<script src="https://cdnjs.cloudflare.com/ajax/libs/benchmark/1.0.0/benchmark.min.js"></script>
<ul id='cycleResults'>
</ul>
<div id="result">
</div>
<br>
<button id="btn">
Run Tests
</button>

Antwoord 2, autoriteit 99%

Ik besloot een tool als deze te bouwen. De eerste openbare bèta is op https://jsbench.me

BEWERK: 2020-07-12 – v1 vrijgegeven


Antwoord 3, autoriteit 37%

Er is ook https://www.measurethat.net/waarmee u javascript-benchmarks kunt maken en uitvoeren


Antwoord 4, autoriteit 34%

Augustus 2020: wat werkt

JSPerf is nog steeds niet beschikbaar en veel van de hier geposte alternatieven werken niet meer. Om de tijd van anderen te besparen bij het lezen van berichten, is hier een lijst van degenen die welnog werken, vanaf augustus 2020.

Ik kan niet instaan voor de prestaties van een bepaalde tool, alleen dat ze recentelijk actief waren.


Antwoord 5, autoriteit 15%

Ik heb toevallig http://jsbench.github.io/leren kennen.

Het doet duidelijk denken aan de goede oude jsperf.

U kunt uw benchmark opslaan, delen en ze houden de prestaties per browser bij.

Hier is er een die ik zojuist heb verzonnen:
For loop-benchmark

(Als een kanttekening: je kunt alleen een benchmark opslaan als je een github-account hebt.)


Antwoord 6, autoriteit 10%

Hoewel jsperf online is, als je toch naar alternatieven wilt kijken, heb ik https://jsben.ch/behoorlijk nuttig en goed ontworpen te zijn.

Other episodes