Утилита Bandwidth с использованием javascript

Ответ 1

Не знаю какой-либо утилиты или стандартного API, но вы можете сделать это, имея несколько изображений разных размеров на своем веб-сайте, а затем извлекать их в обход кеша и смотреть, сколько времени потребуется для их загрузки. Эта информация вместе с размером изображения дает вам указание скорости между двумя конечными точками.

Причиной использования нескольких изображений является то, что вы захотите начать с малого (например, 20k), но если соединение будет быстрым, это даст вам очень неточное число; поэтому, основываясь на том, как быстро загрузится этот образ, вам нужно выбрать другое изображение соответствующего размера, чтобы попытаться лучше понять фактическую пропускную способность (в отличие от задержки, создающей соединение и т.д.).

Вы можете сделать это только с помощью прямого JavaScript, добавив img теги off-page с уникальной строкой запроса для обхода кеширования; но поскольку вы отметили свой вопрос "jQuery", вам может быть удобнее использовать функцию .ajax (с настройкой cache: false).

Номер скорости, с которым вы сталкиваетесь, является лишь показателем, поскольку могут произойти другие вещи, которые могут испортить ваше время (потоковое видео на другой вкладке – или на другом компьютере, подключенном к тому же интернет-соединению, даже другие вещи замедляя выполнение вашего JavaScript, как JS-тяжелая анимация на странице), но он должен быть достаточно хорош, чтобы дать вам представление о том, с чем вы работаете.

Ответ 2

    // Network connection - https://github.com/daniellmb/downlinkmax
var connectionSpeed = function() 
{
    // Deal with vendor prefixes
    var defaultSpeed = false,
        navigator = window.navigator,
        connection = navigator.connection || navigator.mozConnection || navigator.webkitConnection || null;
    if( ! connection )
        return defaultSpeed;

    // assume W3C Editor Draft 09 October 2014
    if( 'downlinkMax' in connection )
    {
        var downlinkMax = connection.downlinkMax;
        if( ! downlinkMax )
            return defaultSpeed;
        if( ! isFinite(downlinkMax) )
            return defaultSpeed;
        return downlinkMax;
    }
    // assume W3C Working Draft 29 November 2012
    if( 'bandwidth' in connection )
    {
        var bandwidth = connection.bandwidth;
        if( ! bandwidth )
            return defaultSpeed;
        if( isNaN(speed) )
            return defaultSpeed;
        // standardize connection.bandwidth value by converting megabytes per second (MB/s) to megabits per second (Mbit/s)
        return bandwidth * 8;
    }
    // assume W3C Working Draft 07 June 2011
    switch( connection.type )
    {
        // convert connection.type value to approximate downlink values
        // speed estimate is based on the median downlink value for common devices in megabits per second (Mbit/s)
        case 'none':
            return 0;
        case '2g':
            return 0.134;
        case 'bluetooth':
        case 'cellular':
            return 2;
        case '3g':
            return 8.95;
        case '4g':
            return 100;
        case 'ethernet':
            return 550;
        case 'wifi':
            return 600;            
    }
    return defaultSpeed;
};

Ответ 3

Мне нужно что-то подобное, поэтому я написал https://github.com/beradrian/jsbandwidth, переписать https://code.google.com/p/jsbandwidth/.

Идея состоит в том, чтобы сделать два вызова через Ajax, один для загрузки, а другой - через POST.

Он должен работать как с jQuery.ajax, так и с Angular $http.