کس طرح West Browser-Native PPGX outport — کوئی سرور درکار نہیں

مسئلہ

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

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

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

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

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

• VideoEncoder — brow Vide فریمس لیتا ہے، برآمدات Encodd H.264 (یا VP8/VP9/VP1) بٹسترام کیمرا۔
• VideoDecoder — encoded construction، برآمدات خام فریمس (playback کے لیے استعمال کرتے ہیں، برآمد نہیں)۔

PPGX برآمد کے لیے ہم VideoEncoder استعمال کرتے ہیں۔. کارگو:

1. مطلوبہ حل و تخطq پر H.264 کے لیے VideoEncoder Foundation بنائیں
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.42E01EATH.264 بیس لائن پروڈیوس۔. یہ سب سے زیادہ میلنگ ایچ۔264 profile — یہ ہر فون، براؤزر اور سوشل میڈیا پلیٹ فارم پر کھیلتا ہے۔. اعلیٰ عہدے دار (Main, High) بہتر دباؤ پیش کرتے ہیں مگر کم شرحیں [Richardson, 2010)۔.

بٹیٹ کی کیفیت ورس فائل حجم کو کنٹرول کرتی ہے۔. ایک 3 سیکنڈ کے لیے 5 Mbs پر: 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
}

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

ہدایت 3:PPGX Muxing

The Videencorder outs bush H.264 یو ایس این اے سی آرک آئی ڈی:. یہ کوئی قابل ذکر فائل نہیں ہیں — انہیں MP4 سانچے میں ڈھالنا پڑتا ہے جو وقت، میٹاداٹا اور کوڈک کی حامل کمپنی ہے۔.

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 لیومنگ، پی پی جی0X ایمکسنگ اور ڈاؤن لوڈ — براؤزر میں ہوتا ہے۔. کوئی سرور. کوئی اپلوڈ. کوئی تیسرا شراکت کاری نہیں.

پیش کش

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٪].

لمبا کلک کريں. دونوں برتن ایک پیمانے پر شیئر کرتے ہیں، تو Enccode بار کے اندر بیٹھے ہوئے کلپ بار س دعویٰ — اور تینوں کے درمیان میں تبدیلی سے کام بڑھتا نظر آتا ہے۔ فریموں کے لحاظ سے جو حصہ ایک قطار ہوتا ہے وہ ظاہر نہیں ہو سکتا۔.

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

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

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

حوالہ جات

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

---

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