Should I filter a large Eleventy collection in a data file before pagination, or paginate everything?

Answer the Exact Question

If you want to keep the build time, output size, and page count predictable, filter the collection in a JavaScript data file (or a custom collection) before Eleventy sees it. Paginating the full collection and then hiding items in the template will still generate every page, so the build does not shrink.

Why Filtering Early Matters

• Eleventy’s pagination front‑matter works on the array you pass to it. The number of output pages is ceil(array.length / size) and Eleventy renders each chunk exactly once.
• When you filter the array first, the array length is already reduced, so the number of rendered pages and the total files written shrink accordingly.
• Hiding items inside the template does not affect the array Eleventy receives; pagination still slices the entire collection, writes every page, and the hidden items simply never appear in the rendered HTML.

Impact on Pagination Links

The pagination.href.previous, pagination.href.next, and pagination.pages helpers are calculated from the array that pagination receives. If you filter first, the links point to the pages of the filtered set, exactly as you expect. No special handling is required.

URL Stability When Changing Page Size

Eleventy’s default permalinks embed pagination.pageNumber. Changing the size value therefore shifts the boundaries of every page and invalidates all previously published URLs. Eleventy does not provide a built‑in way to keep the URLs stable when the page size changes.

• Choose a size that you treat as permanent and avoid changing it after the site is live.
• If you must change the size, add redirects from the old URLs to the new ones or switch to a key‑based pagination scheme (e.g. by using the first item’s slug or a date as the page key).

Practical Steps for Your Project

1. Create a data file that fetches or generates the raw collection. For example, src/data/posts.js could export an array of all posts.
2. Apply any filtering logic you need. Keep only the items that should appear in the archive.
3. Export the filtered array. Eleventy will use this array as the pagination source.
4. In your pagination template, use:

   ---
   pagination:
     data: posts
     size: 20
     alias: posts
   ---
   

5. Build and verify that the number of generated pages equals ceil(filteredCount / 20).
6. Test pagination.href.previous and pagination.href.next on the first, middle, and last pages to confirm the links point within the filtered set.

Missing Diagnostic Detail

To fine‑tune the recommendation, could you confirm the maximum number of items you anticipate in the archive and whether you plan to change the page size after the site is live?