ਇੱਕ CI ਵੀਡੀਓ ਪਾਈਪਲਾਈਨ ਲਈ ਡਾਇਗ੍ਰਾਮ ਸਲਾਈਡਾਂ ਬਣਾਉਣ ਵੇਲੇ ਮੈਂ ਕੀ ਸਿੱਖਿਆ
ਮੈਂ ਹਾਲ ਹੀ ਵਿੱਚ ਆਪਣੀ ਆਟੋਮੇਟਡ YouTube ਵੀਡੀਓ ਪਾਈਪਲਾਈਨ ਵਿੱਚ ਡਾਇਗ੍ਰਾਮ ਅਤੇ ਚਾਰਟ ਜੋੜੇ ਹਨ।
ਮੁੱਖ ਸਿੱਖਿਆ ਸਧਾਰਨ ਹੈ: ਪਹਿਲਾਂ ਸਭ ਕੁਝ ਇੱਕ PNG ਫਾਈਲ ਵਿੱਚ pre-render ਕਰੋ।
ਆਪਣੇ ਵੀਡੀਓ ਇੰਜਣ ਦੇ ਅੰਦਰ ਜਾਂ ffmpeg ਰਾਹੀਂ ਵਿਜ਼ੂਅਲਸ (visuals) ਬਣਾਉਣ ਦੀ ਕੋਸ਼ਿਸ਼ ਨਾ ਕਰੋ। ਇਸ ਦੀ ਬਜਾਏ ਇੱਕ ਸਾਂਝਾ PNG handoff ਵਰਤੋਂ। ਇਹ ਤੁਹਾਡੀ ਪਾਈਪਲਾਈਨ ਦੇ ਹਰ ਹਿੱਸੇ ਨੂੰ ਟੈਸਟ ਕਰਨਯੋਗ ਅਤੇ ਬਦਲਣ ਵਿੱਚ ਆਸਾਨ ਬਣਾਉਂਦਾ ਹੈ।
ਇੱਥੇ ਦੱਸਿਆ ਗਿਆ ਹੈ ਕਿ ਮੈਂ ਇਸਨੂੰ ਕਿਵੇਂ ਬਣਾਇਆ ਅਤੇ ਮੈਂ ਕੀ ਸਿੱਖਿਆ।
ਆਰਕੀਟੈਕਚਰ (The Architecture)
ਮੇਰੀ ਪਾਈਪਲਾਈਨ ਇੱਕ two-host ਸਿਸਟਮ ਦੀ ਵਰਤੋਂ ਕਰਦੀ ਹੈ। ਇੱਕ ਹੋਸਟ ਵਿਜ਼ੂਅਲਸ ਅਤੇ ਆਡੀਓ ਨੂੰ ਸੰਭਾਲਦਾ ਹੈ। ਦੂਜਾ ਹੋਸਟ ਸਭ ਕੁਝ ਇੱਕ ਵੀਡੀਓ ਵਿੱਚ ਜੋੜਨ ਲਈ ffmpeg ਦੀ ਵਰਤੋਂ ਕਰਦਾ ਹੈ।
ਕਿਉਂਕਿ ffmpeg JavaScript ਨਹੀਂ ਚਲਾ ਸਕਦਾ ਜਾਂ ਬ੍ਰਾਊਜ਼ਰ ਨੂੰ ਕਾਲ ਨਹੀਂ ਕਰ ਸਕਦਾ, ਮੈਨੂੰ ਵੱਖ-ਵੱਖ ਟੂਲਜ਼ ਵਿਚਕਾਰਲੇ ਅੰਤਰ ਨੂੰ ਹੱਲ ਕਰਨਾ ਪਿਆ:
• Mermaid (ਫਲੋਚਾਰਟਾਂ ਲਈ) Puppeteer ਅਤੇ Chromium ਰਾਹੀਂ ਚੱਲਦਾ ਹੈ। • Matplotlib (ਚਾਰਟਾਂ ਲਈ) Python ਰਾਹੀਂ ਚੱਲਦਾ ਹੈ। • Pillow (ਸਲਾਈਡਾਂ ਲਈ) ਸਿੱਧਾ ਚਿੱਤਰਾਂ (images) 'ਤੇ ਡਰਾਅ ਕਰਦਾ ਹੈ।
ਕਿਉਂਕਿ ਇਹ ਟੂਲਸ ਸਿੱਧੇ ਤੌਰ 'ਤੇ ਇੱਕ ਦੂਜੇ ਨਾਲ ਗੱਲ ਨਹੀਂ ਕਰ ਸਕਦੇ, ਮੈਂ ਇੱਕ ਸਿੰਗਲ ਪੈਟਰਨ ਦੀ ਵਰਤੋਂ ਕਰਦਾ ਹਾਂ: PNG ਵਿੱਚ ਰੈਂਡਰ ਕਰੋ, ਫਿਰ ਉਸ PNG ਨੂੰ Pillow ਕੈਨਵਸ 'ਤੇ ਪੇਸਟ ਕਰੋ। ਦੋ ਰਸਤਿਆਂ ਨਾਲੋਂ ਇੱਕ ਕੋਡ ਪਾਥ (code path) ਬਿਹਤਰ ਹੈ।
ਮੁੱਖ ਤਕਨੀਕੀ ਸਬਕ (Key Technical Lessons)
1. Chromium ਨੂੰ ਕੌਂਫਿਗ ਕਰਨਾ
GitHub Actions ਵਿੱਚ ਚੱਲਦੇ ਸਮੇਂ, ਜੇਕਰ ਤੁਸੀਂ ਖਾਸ ਫਲੈਗਸ (flags) ਦੀ ਵਰਤੋਂ ਨਹੀਂ ਕਰਦੇ ਹੋ, ਤਾਂ Chromium ਫੇਲ ਹੋ ਜਾਵੇਗਾ। ਤੁਹਾਨੂੰ --no-sandbox ਅਤੇ --disable-setuid-sandbox ਸ਼ਾਮਲ ਕਰਨਾ ਚਾਹੀਦਾ ਹੈ। ਇਹਨਾਂ ਤੋਂ ਬਿਨਾਂ, ਕੰਟੇਨਰ ਪ੍ਰੋਸੈਸ ਨੂੰ ਰੋਕ ਦੇਵੇਗਾ।
2. Mermaid Theming
ਜੇਕਰ ਤੁਸੀਂ ਕਸਟਮ ਰੰਗ ਚਾਹੁੰਦੇ ਹੋ, ਤਾਂ ਬਿਲਟ-ਇਨ ਡਾਰਕ ਜਾਂ ਫੋਰੈਸਟ ਥੀਮਾਂ ਦੀ ਵਰਤੋਂ ਨਾ ਕਰੋ। ਉਹ ਥੀਮਾਂ ਤੁਹਾਡੀਆਂ ਸੈਟਿੰਗਾਂ ਨੂੰ ਓਵਰਰਾਈਡ (override) ਕਰ ਦਿੰਦੀਆਂ ਹਨ। "base" ਥੀਮ ਦੀ ਵਰਤੋਂ ਕਰੋ। ਇਹ ਯਕੀਨੀ ਬਣਾਉਣ ਦਾ ਇੱਕੋ ਇੱਕ ਤਰੀਕਾ ਹੈ ਕਿ ਤੁਹਾਡਾ ਕਸਟਮ ਪੈਲੇਟ ਭਰੋਸੇਮੰਦ ਤਰੀਕੇ ਨਾਲ ਕੰਮ ਕਰੇ।
3. Matplotlib Backgrounds
ਚਾਰਟਾਂ ਨੂੰ ਆਪਣੀ ਸਲਾਈਡ ਬੈਕਗ੍ਰਾਊਂਡ ਨਾਲ ਮਿਲਾਉਣਾ ਔਖਾ ਹੈ। ਤੁਹਾਨੂੰ ਤਿੰਨ ਚੀਜ਼ਾਂ ਕਰਨੀਆਂ ਚਾਹੀਦੀਆਂ ਹਨ:
pyplotਨੂੰ ਇੰਪੋਰਟ ਕਰਨ ਤੋਂ ਪਹਿਲਾਂmatplotlib.use("Agg")ਨੂੰ ਕਾਲ ਕਰੋ।- ਫਿਗਰ (figure) ਅਤੇ ਐਕਸਿਸ (axes) ਦੋਵਾਂ ਲਈ
facecolorਸੈੱਟ ਕਰੋ। - ਚਿੱਟੇ ਬਾਰਡਰਾਂ ਨੂੰ ਹਟਾਉਣ ਲਈ ਫਾਈਲ ਸੇਵ ਕਰਦੇ ਸਮੇਂ
bbox_inches="tight"ਦੀ ਵਰਤੋਂ ਕਰੋ।
4. ਭਰੋਸੇਯੋਗਤਾ ਅਤੇ ਫੇਲਸੇਫਸ (Reliability and Failsafes)
ਇੱਕ ਗੁੰਮ ਹੋਇਆ ਡਾਇਗ੍ਰਾਮ ਤੁਹਾਡੀ ਪੂਰੀ ਵੀਡੀਓ ਬਿਲਡ ਨੂੰ ਖਰਾਬ ਨਹੀਂ ਕਰਨਾ ਚਾਹੀਦਾ। ਮੈਂ ਇੱਕ ਸਕੈਫੋਲਡ (scaffold) ਬਣਾਇਆ ਹੈ ਜੋ ਗਲਤੀਆਂ ਨੂੰ ਫੜ ਲੈਂਦਾ ਹੈ। ਜੇਕਰ ਰੈਂਡਰ ਫੇਲ ਹੋ ਜਾਂਦਾ ਹੈ, ਤਾਂ ਪਾਈਪਲਾਈਨ ਸਿਰਫ਼ ਇੱਕ "visual unavailable" ਪਲੇਸਹੋਲਡਰ ਦਿਖਾਉਂਦੀ ਹੈ। ਵੀਡੀਓ ਫਿਰ ਵੀ ਪੂਰੀ ਹੋ ਜਾਂਦੀ ਹੈ। ਇਹ ਤੁਹਾਨੂੰ ਸਮੱਗਰੀ ਦੀ ਸਮੀਖਿਆ ਕਰਨ ਦੀ ਇਜਾਜ਼ਤ ਦਿੰਦਾ ਹੈ ਭਾਵੇਂ ਇੱਕ ਹਿੱਸਾ ਫੇਲ ਹੋ ਜਾਵੇ।
ਸਮਝੌਤਾ (The Trade-off)
Pre-rendering ਸਮਾਂ ਵਧਾਉਂਦੀ ਹੈ। ਹਰੇਕ Mermaid ਡਾਇਗ੍ਰਾਮ ਨੂੰ ਰੈਂਡਰ ਹੋਣ ਵਿੱਚ ਲਗਭਗ 2 ਤੋਂ 4 ਸੈਕਿੰਡ ਲੱਗਦੇ ਹਨ। 20-ਸੈਗਮੈਂਟ ਵਾਲੀ ਵੀਡੀਓ ਲਈ, ਇਹ ਕੁੱਲ ਬਿਲਡ ਸਮੇਂ ਵਿੱਚ ਲਗਭਗ 20 ਸੈਕਿੰਡ ਜੋੜ ਦਿੰਦਾ ਹੈ। ਮੇਰੀਆਂ ਲੋੜਾਂ ਲਈ, ਇੱਕ ਸਥਿਰ ਸਿਸਟਮ ਲਈ ਇਹ ਇੱਕ ਜਾਇਜ਼ ਸਮਝੌਤਾ ਹੈ।