blog/detect-the-intersection-of-multiple-ranges

[giscus[bot]]

blog/detect-the-intersection-of-multiple-ranges

Recently, while working on a feature for Octo, I had to figure out how to test the intersection of multiple ranges using JavaScript. Specifically, I needed to come up with a performant solution to detect when any text-selection ranges intersected with specific syntax node ranges in the editor. This was a fun problem to work on, so I hope you like the solution.

https://voracious.dev/blog/detect-the-intersection-of-multiple-ranges

[EdgardoRodriguezSolano]

Quite niche indeed, but a fun read.

This would be my JS version. The aim was to have two very similar structure and "more importantly" to avoid the nested cycle that leads to all-pairs comparison.

const allIntersect = (...ranges) => {
  const orderedMinimums = ranges.map(r => r.min).sort((a, b) => a < b);
  const orderedRanges = orderedMinimums.map(i => ranges.find(j => j.min == i));
  return Boolean(orderedRanges.reduce((previousValue, currentValue) => {
    if (!previousValue) return;
    if (currentValue.min <= previousValue.max) return currentValue;
  }));
} 

const someIntersect = (...ranges) => {
  const orderedMinimums = ranges.map(r => r.min).sort((a, b) => a < b);
  const orderedRanges = orderedMinimums.map(i => ranges.find(j => j.min == i));
  return (
    orderedRanges.reduce((previousValue, currentValue) => {
      if (previousValue === true) return true;
      return currentValue.min > previousValue.max ? currentValue : true;
    }) === true);
}

[davidmyersdev]

Hey Edgardo. 👋 I'm glad you enjoyed it, and I appreciate you sharing your solution too!