Whead Browser-Native PPGX outport – کوئی سرور درکار نہیں۔

مسئلہ

روایتی ویب پر مبنی امیگریشن آلات ویڈیو ایک سرور میں فریموں کو بھیجنے، ان کو ایفنگ کے ساتھ اور نتیجہ واپس کرنے سے۔ اس کے تین اخراجات ہوتے ہیں: اپ لوڈ کردہ بینڈویڈتھ (انڈرم ڈاٹ کام کے اخذ کردہ میگابیس)، سرور حساب (CPU/PUE Time for Invest)، اور نجی (آپ کی تخلیقی کارکردگی ایک تہائی پارٹی کی بنیاد)۔.

PinePaper اس میں سے کوئی بھی نہیں۔ آپ کے براؤزر میں MP4 فائل مکمل طور پر بنائی گئی ہے۔ کوئی فریم آپ کے ڈیوائس کو چھوڑ. آپ کی مشین ہارڈ ویئر ویڈیو ان کوڈر پر واقع ہے. اِس مضمون میں بتایا گیا ہے کہ یہ کیسے ممکن ہے ۔.

ویب کوڈس (انگریزی: Browodecs) جو بروسر میں واقع ہے۔

ویژیول ورکز API ملائم [W3C، 20 GAN) کے بنانے والے ویڈیو ان کوڈر اور ڈی کوڈر کو کم سطح تک رسائی فراہم کرتا ہے۔ یہ کروم 94 (ستمبر 2021ء) میں تیار کیا گیا تھا اور اب کرومی، ایج اور آپریشن میں دستیاب ہے۔ صفاری اور فیئرگرافی نے جزوی یا تجرباتی حمایت [میں استعمال کر سکتا ہوں، 2026.

ویب کووڈکس دو کلیدی سطحوں کو ظاہر کرتا ہے:

• VideoEncoder — rawолика frameеро frameерери، نکلسن انس کوڈ H.264 (یا VP8/VP9/VP11) بٹسترام کیمرا۔
• VideoDecoder — encoded company, outs raft arms (playback, Exports) کے لیے استعمال ہونے والا ایکسچینج (Excoded activity) لیتا ہے۔

MP4 برآمد کے لیے ہم XQQ استعمال کرتے ہیں۔ کارگو:

1. مطلوبہ حل و تخطrate پر H.264 کے لیے VideoEncoderAT بنائیں
2. ہر انٹرمیڈیٹ فریم کے لئے: VideoFrame کے طور پر، اسے کھلاتے ہیں۔ encoder ميں
3. Encoded countries (raw H.264 NAL units) کو جمع کریں
4. ایک پی‌جی‌ٹی‌ٹی‌ٹی‌ٹی‌کسی سانچے میں تبدیل کریں
5. ڈاؤن لوڈ کے لیے PPGX فائل پیش کریں

پہلا قدم

const encoder = new VideoEncoder({
  output: (chunk, metadata) => {
    // chunk.data contains encoded H.264 bytes
    // metadata.decoderConfig contains SPS/PPS on first chunk
    muxer.addVideoChunk(chunk, metadata);
  },
  error: (e) => console.error('Encoder error:', e)
});

encoder.configure({
  codec: 'avc1.42E01E',  // H.264 Baseline Profile Level 3.0
  width: 1080,
  height: 1080,
  bitrate: 5_000_000,    // 5 Mbps
  framerate: 30
});

کوڈک اسٹرنگ avc1.42E01E یو ایس این ایچ۔264 بیس لائن پروڈیوس۔ یہ سب سے زیادہ میلنگ ایچ۔264 پروڈیوس ہے — یہ ہر فون، براؤزر اور سوشل میڈیا پلیٹ فارم پر کھیلتا ہے۔ اعلیٰ عہدے دار (Main, High) بہتر دباؤ پیش کرتے ہیں مگر کم شرحیں [Richardson, 2010)۔.

بٹیٹ کی کیفیت ورس فائل حجم کو کنٹرول کرتی ہے۔ ایک 3 سیکنڈ کے لیے 5 میزائل پر: 5,000,000 bits/s × 3s = 15,000,000 bits = ~1.8 MB. مواد کی پیچیدگی پر مبنی سائز مختلف ہوتا ہے — عام مناظر میں تیزی سے حرکت کرنے سے بہتر ہوتا ہے ۔.

دوسرا مرحلہ

انیمیشن ٹائم لائن میں ہر فریم کے لئے:

for (let frameNum = 0; frameNum < totalFrames; frameNum++) {
  const frameTime = frameNum / fps;

  // Advance animation to this time
  app.setPlaybackTime(frameTime);
  paper.view.draw();  // Full render (not view.update!)
  await new Promise(r => requestAnimationFrame(r));  // Wait for paint

  // Create VideoFrame from canvas
  const frame = new VideoFrame(canvas, {
    timestamp: frameNum * (1_000_000 / fps)  // microseconds
  });

  // Encode (keyframe every 2 seconds)
  encoder.encode(frame, {
    keyFrame: frameNum % (fps * 2) === 0
  });
  frame.close();  // Release GPU memory
}

اہم تفصیل: انیمیشن کو آگے بڑھانے اور انکلیشن دینے کے بعد، آپ کو XQQ کے پہلے انتظار کرنا ہوگا۔ اس بات کو یقینی بنایا گیا ہے کہ جی پی یو نے نظام شمسی کو ختم کر دیا ہے۔ اِس عمل کے بغیر آپ کسی ایسے شخص کو پکڑ کر اُس کے لیے ایسے فریم تیار کر لیتے ہیں جن سے اُس کے پاس کوئی چارہ نہیں ہوتا ۔.

ہدایت 3:PPGX Muxing

The Videencorder outs bush H.264 یو ایس این اے سی آرک آئی ڈی: یہ کوئی ڈرامائی فائل نہیں ہیں — اُنہیں پی‌جی‌جی‌جی‌ٹی‌ایس کے ایک برتن میں ڈھالنے کی ضرورت ہے جو وقت ، میٹراڈاٹا اور کوڈ‌کوڈنگ کو محفوظ رکھتا ہے ۔.

PinePaper اس مرحلے کے لیے [Vani, mp4-muxer]] کے لیے TVemp4-muxsse Library استعمال کرتا ہے۔ ایمکسیر کو وقتاً فوقتاً encorded use ملا کر ایک درست پی پی جی1X فائل تیار کرتا ہے:

• ftyp باکس: فائل کی قسم اعلان (Iso2, imp41) ہے۔
• moov باکس: فلم میٹاداٹا، راست تشریحات، وقت کی شرائط
• mdat باکس: اصل میں ویڈیو ڈیٹا

اس کا نتیجہ ایک معیاری پی پی جی0X ہے جو ہر ویڈیو کھلاڑی، براؤزر اور سوشل میڈیا پلیٹ فارم میں کھیلتا ہے۔.

ہدایت : نیچے دی گئی ہدایت پر عمل کریں

پی پی جی0X کو ایک Blob کے طور پر جمع کیا جاتا ہے، URL.createObjectURL() کے ذریعے URL میں تبدیل کر دیا جاتا ہے اور ڈاؤن لوڈ کے طور پر تبدیل کر دیا جاتا ہے:

await encoder.flush();  // Wait for all frames to encode
const mp4Blob = muxer.finalize();
const url = URL.createObjectURL(new Blob([mp4Blob], { type: 'video/mp4' }));

const a = document.createElement('a');
a.href = url;
a.download = 'animation.mp4';
a.click();
URL.revokeObjectURL(url);

پورا پائپ — فریم پر قبضہ ، ایچ .264 ایم‌ٹی‌ایس ، پی‌جی‌جی‌ٹی‌ایس‌کسینگ اور ڈاؤن‌لوڈ میں ہوتا ہے ۔ کوئی سرور. کوئی اپلوڈ. کوئی تیسرا شراکت کاری نہیں.

پیش کش

2023 میک بک پرو (M2) پر ایک 1080×1080 Induction 30 FPS:

مدت	فریمس	ای‌کوڈ ٹائم	فائل حجم
۳ سیکنڈ	90	~2 سیکنڈ	~1.8 MB
10 سیکنڈ	300	~6 سیکنڈ	~5MB
30 سیکنڈ	900	~18 سیکنڈ	~14MB

Encoding حقیقی وقت سے زیادہ تیز ہے کیونکہ ہارڈ ویئر ایچ۔264 این کوڈرز (انگریزی: Intelugh Sync, Apple Video Toolbox, NVIDIA NAC) بھاری حساب سے کام لیتا ہے۔ [McIlloy، 20٪].

براہِ‌راست مدد

براہِ راست	ویب کوڈ	ایس	سٹیٹس
کروم 94+	ہاں	ہاں	بھرپور مدد
Edge 94+	ہاں	ہاں	مکمل حمایت (Chromium) ہے۔
80+ آپریشن	ہاں	ہاں	مکمل حمایت (Chromium) ہے۔
صفاری 16.4+	غیر متصل	ڈی کوڈ صرف	دستیاب نہیں
فوکس	جھنڈے کے پیچھے	نہیں	رنگ

For Broaders with WebCodecs، PPGG1X برآمدے میں واپس گرتا ہے جو خالص جاوا ایسکریپٹ این کوڈر (Gif.js) استعمال کرتا ہے اور ہر جگہ کام کرتا ہے۔.

حوالہ جات

• میں استعمال کر سکتا ہوں (2026). ویب کوڈکس پی پی جی0X براؤزر میز. کینس.com/webcodecs.
• مک اللوی، ڈی (2021ء)۔ WebCodecs viewer. W3C WICG. Github.com/nicerobot/nicrobot.github.io/blob/ster/nicrobot-conter-webcodecs.md. اخذ شدہ بتاریخ 09. تحقق من التاريخ في:.
• رچرڈسن، آئی اے جی (2010ء)۔ * The H.264 Edvation Vide Standard* (2nd ed.)۔ ویلی.
• وانی، اے۔amp4-muxer — JavaScrip MP4 Muxer for WebCodecs. github.com/nicerobot/nicrobot.github.io.io. اخذ شدہ بتاریخ 17 جولا ئی 2014. تحقق من التاريخ في:.
• W3C (2021). WebCodecs API Republication. 25 دسمبر 2018 میں اصل سے آرکائیو شدہ. تحقق من التاريخ في: W3c.github.io/webcodecs/.

---

آزاد کیلئے پی‌GX ویڈیو — کوئی سرور ، کوئی دستخط کرنے والا نہیں ، نہ ہی کوئی پانی کامار ۔ کھلا pinepaper.studio/editor اور اس کی کوشش کرتا ہے۔.