DEV Community

Discussion on: Angular: Async Rendering with a single Rx Operator

Collapse
 
stradivario profile image
Kristiqn Tachev • Edited

Awesome operator!

I manage to make it simpler

export const lazyArray = <T>(
  delayMs = 0,
  concurrency = 2,
  isFirstEmission = true
) => (source$: Observable<T[]>) =>
  source$.pipe(
    mergeMap(items =>
      !isFirstEmission
        ? of(items)
        : from(items).pipe(
            bufferCount(concurrency),
            concatMap((value, index) =>
              scheduled(of(value), animationFrameScheduler).pipe(
                delay(index * delayMs)
              )
            ),
            scan((acc: T[], steps: T[]) => [...acc, ...steps], []),
            tap((scannedItems: T[]) =>
              scannedItems.length === items.length
                ? (isFirstEmission = false)
                : null
            )
          )
    )
  );

Enter fullscreen mode Exit fullscreen mode