site2paper؛ تبدیل صفحه‌های وب به دفترچهٔ PDF با Node.js

چرا مهم است

اگر می‌خواهی سایت را روی کاغذ مرور کنی، خروجی چاپ معمولی ممکن است همهٔ محتوای دیده‌شده در مرورگر را نداشته باشد. site2paper با ثبت تصویر صفحه‌ها، راه دیگری برای ساخت دفترچهٔ PDF ارائه می‌کند.

قبل از خواندن، این‌ها را بدان۳ مفهوم
Infinite Scroll

روشی برای نمایش محتوا که با رسیدن کاربر به بخش‌های پایین صفحه، محتوای بیشتری اضافه می‌کند و لزوماً پایان یا صفحه‌بندی مشخصی ندارد.

در حال نگارش: Infinite Scroll

CLI

رابطی برای اجرای ابزار با نوشتن دستور و گزینه‌ها در terminal،؜ به‌جای کار با دکمه‌ها و پنجره‌های گرافیکی.

در حال نگارش: CLI

Lazy Loading

روشی که بارگذاری بخشی از محتوا را تا زمان نیاز، مثلاً نزدیک‌شدن آن به محدودهٔ قابل‌دید صفحه، به تعویق می‌اندازد.

در حال نگارش: Lazy Loading

سازندهٔ site2paper این ابزار را برای مرور کاغذی سایت و یادداشت‌گذاری با قلم ساخته است. به‌گفتهٔ او، چاپ معمولی با Ctrl+P می‌تواند صفحه‌های بدقالب یا خالی تولید کند و بخشی از محتوای JavaScript یا carousel را جا بیندازد. site2paper یک CLI مبتنی بر Node است که به‌جای تکیه بر ظاهر چاپی سایت، از آنچه بازدیدکننده می‌بیند تصویر می‌گیرد و یک دفترچهٔ PDF می‌سازد.

در آزمایشی که سازنده روی یک سایت کاتالوگی ۴۸ صفحه‌ای گزارش کرده، خروجی Ctrl+P به ۱۷۱ برگ و ۷۵ مگابایت رسیده؛ خروجی site2paper برای همان سایت ۲۵ برگ و ۶٫۴ مگابایت بوده است. این اعداد مربوط به همان آزمایش‌اند، نه نتیجه‌ای تضمین‌شده برای همهٔ سایت‌ها.

در انتشار نخست، کشف صفحه‌ها ابتدا بر پایهٔ sitemap.xml و sitemap index انجام می‌شود. اگر این مسیر در دسترس نباشد، ابزار با پیمایش سطح‌به‌سطح، صفحه‌های همان origin را دنبال می‌کند؛ سقف فعلی ۵۰ صفحه است. سپس playwright-core مرورگر نصب‌شدهٔ Chrome یا Edge را هدایت می‌کند. تنها اگر هیچ‌کدام موجود نباشند، headless Chromium دانلود می‌شود.

هر صفحه مرحله‌به‌مرحله scroll می‌شود تا محتوای وابسته به Lazy Loading و IntersectionObserver بارگذاری شود؛ سپس یک تصویر PNG از کل صفحه ثبت می‌شود. آماده‌سازی خروجی با CSS و script در صفحه‌های headless انجام می‌شود: carousel‌های Swiper،؜ Slick،؜ Embla،؜ Splide و Owl به grid تبدیل می‌شوند، بنرهای cookie با selector پنهان می‌شوند و روی آن‌ها کلیک نمی‌شود. عنصرهای sticky و fixed نیز حذف می‌شوند. برای قاب‌های sticky به‌اندازهٔ viewport در بخش‌های بلند، ابزار در چهار نقطه تصویر می‌گیرد و آن‌ها را به‌شکل نوار تصویری با نشانگرهای ۰، ۳۳، ۶۷ و ۱۰۰ درصد چاپ می‌کند.

در مرحلهٔ چیدمان، sharp تصویرها را برش می‌دهد و ردیف‌های خالی محل برش را مشخص می‌کنند. محتوا در یک تا چهار ستون قرار می‌گیرد و pdf-lib فایل PDF را با قطعه‌های JPEG می‌نویسد. سایت‌های نیازمند ورود، Infinite Scroll و محتوایی که فقط با کلیک آشکار می‌شود، هنوز از مواردی هستند که سازنده روی آن‌ها کار می‌کند.

نکته کلیدی

پیش از چاپ، خروجی سایتت را بررسی کن؛ سازنده هنوز روی سایت‌های نیازمند ورود و کار می‌کند. محتوایی را هم که فقط با کلیک آشکار می‌شود، در خروجی قطعی فرض نکن.

خواندن مقاله اصلی (در زبانه‌ی جدید باز می‌شود)
برچسب‌ها (۴)