在使用IntersectionObserver时，应该避免考虑在边缘相交的情况，因为该情况会导致不必要的性能开销。下面是一个简单的解决方案，可以使用一个容器元素包含需要观察的元素，并将容器的边缘与视口区域的边缘重叠，这样可以确保没有元素在边缘相交的情况下，所有元素都处于容器的内部。

HTML代码示例:

CSS代码示例:

.container {
  position: relative;
  height: 100vh;
  width: 100vw;
  overflow: hidden;
}

.item {
  height: 100vh;
  width: 100vw;
  background-color: #f0f0f0;
}

JavaScript代码示例:

const container = document.querySelector('.container');
const items = document.querySelectorAll('.item');

const observer = new IntersectionObserver((entries) => {
  entries.forEach(entry => {
    if (entry.isIntersecting) {
      // do something
    }
  });
});

items.forEach(item => {
   observer.observe(item);
});

在这个例子中，.container 元素作为 IntersectionObserver 对象要观察的元素，并将 .item 元素置于容器内。观察器将 .item 元素标记为进入视口时发生交集，然后执行相应的操作。由于所有元素都位于容器内部，避免了在边缘相交的情况下的性能问题。