Benchmark: opening hours - MeasureThat.net

HTML Preparation code:

<div id="root"></div>

<script src="https://openingh.openstreetmap.de/opening_hours.js/opening_hours+deps.min.js"></script>
<script src="https://unpkg.com/react@16/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
<script src="https://cdn.jsdelivr.net/npm/lodash@4.17.15/lodash.min.js"></script>

Script Preparation code:

const weekDays = [
  "sundayShort",
  "mondayShort",
  "tuesdayShort",
  "wednesdayShort",
  "thursdayShort",
  "fridayShort",
  "saturdayShort",
];

const dateToDayName = (date) => weekDays[date.getDay()];

function currentWeekRange () {
  const dt = new Date(); // current date of week
  dt.setHours(0); //reset hours
  const currentWeekDay = dt.getDay();
  const daysToMonday = currentWeekDay === 0 ? 6 : currentWeekDay - 1;
  const weekStart = new Date(new Date(dt).setDate(dt.getDate() - daysToMonday));
  const weekEnd = new Date(new Date(weekStart).setDate(weekStart.getDate() + 7));
  return { weekStart, weekEnd };
};

function parseOpeningHours(openingHoursRaw, timeFormat){
    const openingHours = new opening_hours(openingHoursRaw,{ address: {country_code:"us"}});
    const {
        weekStart,
        weekEnd
    } = currentWeekRange();
    const intervals = openingHours.getOpenIntervals(weekStart, weekEnd);
    const timeRanges = {};
    intervals.forEach((interval)=> {
        const weekDay = dateToDayName(interval[0]);
        //init array if day key is missing
        if (!timeRanges[weekDay]) timeRanges[weekDay] = [];
        const hoursFrom = interval[0].toLocaleTimeString("en-US", {
            hour: "2-digit",
            minute: "2-digit",
            hour12: timeFormat ,
        });
        const hoursTo = interval[1].toLocaleTimeString("en-US", {
            hour: "2-digit",
            minute: "2-digit",
            hour12: timeFormat,
        });
        timeRanges[weekDay].push(`${hoursFrom} - ${hoursTo}`);
    });
    const todayValues = timeRanges[dateToDayName(new Date())];

    const today = new Date().getTime();
    const todayNextChangeDiff = openingHours.getNextChange() - today;
    const todayNextChangeDiffHours = Math.trunc(todayNextChangeDiff / (1000 * 60 * 60));

    return {
        timeRanges,
        todayValues,
        isItOpenNow: openingHours.getState(),
        nextChange: todayNextChangeDiffHours
    };
};

function Memo(props) {
  const handler = React.useMemo(() => {
      return _.debounce(props.handler, props.wait);
  }, [props.handler, props.wait]);
  return React.createElement("div", { className: handler() });
}


var propCases = [{
    handler: function() {
        return Math.random();
    },
    wait: 100
}, {
    handler: function() {
        return Math.random();
    },
    wait: 200
}];
propCases.push(propCases[1]);

Tests:

parseOpeningHours
propCases.forEach((props, i) => { parseOpeningHours('Mo,Tu,Th,Fr 12:00-18:00; Sa,PH 12:00-17:00; Th[3],Th[-1] off' , '12h') });
memo
propCases.forEach((props, i) => { ReactDOM.render(React.createElement(Memo, props, null), root); });

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
parseOpeningHours
memo

Fastest: N/A

Slowest: N/A

Latest run results:

No previous run results

This benchmark does not have any results yet. Be the first one to run it!

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript microbenchmarks.

The provided JSON represents two test cases: `parseOpeningHours` and `memo`. We'll break down what's being tested, the options compared, their pros and cons, and other considerations.

**Test Case 1: parseOpeningHours**

This benchmark tests the performance of a function named `parseOpeningHours`, which is part of the `opening_hours` library. The function takes two arguments: an opening hours string and a time format.

Here's what's being tested:

* The `openning_hours` library is being used to parse the opening hours string.
* The function returns an object with several properties, including `timeRanges`, `todayValues`, `isItOpenNow`, and `nextChange`.

The benchmark definition uses the `propCases` array, which contains two objects with different handler functions and wait times. The `parseOpeningHours` function is called for each iteration of `propCases`.

**Options compared:**

* Different handler functions (e.g., `Math.random()`)
* Wait times (100ms or 200ms)

Pros:

* This benchmark tests the performance of a specific library (opening_hours) in different scenarios.
* It allows users to compare the results with and without the library.

Cons:

* The test is limited to two handler functions, which might not be representative of all possible use cases.
* The wait times are relatively short, which might not accurately reflect real-world performance.

**Test Case 2: memo**

This benchmark tests the performance of a React component named `Memo`. The component uses the `React.useMemo` hook to debounce a handler function.

Here's what's being tested:

* The performance of the `Memo` component with different wait times.
* The impact of debouncing on the component's execution time.

The benchmark definition uses the `propCases` array, which contains two objects with different handler functions and wait times. The `ReactDOM.render` method is used to render the `Memo` component for each iteration of `propCases`.

**Options compared:**

* Different wait times (100ms or 200ms)
* Debouncing vs. non-debouncing behavior

Pros:

* This benchmark tests the performance of a React component in different scenarios.
* It allows users to compare the results with and without debouncing.

Cons:

* The test is limited to two wait times, which might not be representative of all possible use cases.
* The impact of debouncing on the component's execution time might vary depending on other factors (e.g., network latency).

**Other considerations:**

* Both benchmarks use real-world-like data and scenarios, making them more relevant than simple microbenchmarks.
* The use of multiple browsers and devices in the benchmark result provides a more accurate representation of real-world performance.

If you're interested in alternative approaches or tools for benchmarking JavaScript code, here are some options:

1. **Benchmark.js**: A popular JavaScript benchmarking library that allows you to create custom benchmarks and compare results.
2. **Benchpress.js**: Another JavaScript benchmarking library that provides a simple way to create and run benchmarks.
3. **Microbenchmarking frameworks like Benchmark**: A Node.js module for creating microbenchmarks, which can be used with JavaScript code.

Remember that the choice of benchmarking tool or approach depends on your specific use case and requirements.

Related benchmarks:

opening hours (version: 0)

Comparing performance of: parseOpeningHours vs memo

Created: 4 years ago by: Guest

Jump to the latest result

parseOpeningHours

memo

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

No previous run results

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):