HTML to Markdown تبدیلی کیا ہے؟
HTML وہ رینڈر شدہ markup ہے جو براؤزر دکھاتا ہے — <h1>، <ul>، <table>، <a>، وغیرہ۔ Markdown ایک ہلکا پھلکا plain-text فارمیٹ ہے جو کم سے کم رموز (# headings کے لیے، * emphasis کے لیے، - لسٹ آئٹمز کے لیے) سے وہی structure encode کرتا ہے۔ GitHub Flavored Markdown (GFM) اصل CommonMark spec کو tables، strikethrough، task lists اور autolinks سے بڑھاتا ہے۔ HTML کو Markdown میں تبدیل کرنا رینڈر شدہ یا exported HTML کو قابل ترمیم plain-text Markdown میں واپس لاتا ہے — بالکل وہی جو CMS سے content migration یا README کی صفائی کے لیے چاہیے۔
آؤٹ پٹ میں کون سے GitHub Flavored Markdown features سپورٹ ہیں؟
بنڈل شدہ turndown@7.2.0 انجن turndown-plugin-gfm extension کے ساتھ آپ کے HTML سے مکمل GFM superset خارج کرتا ہے: ATX طرز کے headings # سے ###### تک <h1>–<h6> سے، nesting کے ساتھ ordered اور unordered لسٹس، bold **text** اور italic *text*، strikethrough ~~text~~ <del> سے، inline links [text](url) اور images ، language hints کے ساتھ fenced code blocks (```js)، inline code spans `code`، <table> سے pipe tables، GFM task lists - [ ] / - [x] checkbox inputs سے، blockquotes >، اور horizontal rules ---۔ preview pane خارج شدہ Markdown کو marked@12.0.2 سے دوبارہ رینڈر کرتا ہے تاکہ آپ بصری طور پر تبدیلی کی تصدیق کر سکیں۔
HTML to Markdown تبدیلی کیسے کام کرتی ہے؟
ہر تبدیلی آپ کے براؤزر میں مقامی طور پر تین بنڈل شدہ لائبریریوں کے ساتھ چلتی ہے — کوئی CDN نہیں، کوئی fetch نہیں، کوئی telemetry نہیں۔ بلند سطحی اقدامات یہ ہیں:
- Sanitize: پیسٹ کیا گیا HTML پہلے
DOMPurify.sanitize(html, { USE_PROFILES: { html: true } })سے گزرتا ہے تاکہ<script>عناصر، ہرon*event handler، اورjavascript:URIs ہٹائے جائیں قبل اس کے کہ کوئی code markup میں جائے۔ DOMPurify وہی XSS sanitizer ہے جو Mozilla MDN، Atlassian، اور Microsoft 365 استعمال کرتے ہیں۔ - Convert:
turndownService.turndownصاف شدہ DOM پر چلتا ہے اور GitHub Flavored Markdown خارج کرتا ہے — headings#prefixes بنتے ہیں، lists-/1.آئٹمز بنتی ہیں،<table>pipe table بنتا ہے، وغیرہ۔ Markdown read-only output<textarea>میںvalueکے ذریعے لکھا جاتا ہے (کبھیinnerHTMLنہیں)، اس لیے یہ inherently safe ہے۔ - Render: خارج شدہ Markdown
marked.parseسے دوبارہ parse ہوتا ہے،DOMPurifyسے دوبارہ sanitize ہوتا ہے، اور preview pane کےinnerHTMLکو assign ہوتا ہے تاکہ آپ کو بصری تصدیق ملے کہ Markdown متوقع structure میں round-trip ہوتا ہے۔ Live mode 150 ms debounce کرتا ہے تاکہ پیسٹ کرتے وقت آؤٹ پٹ اپڈیٹ ہو بغیر parser پر بوجھ ڈالے۔
اس ٹول سے HTML کو Markdown میں کیوں تبدیل کریں؟
- رازداری: ہر sanitize، convert اور render pass آپ کے براؤزر میں ہوتا ہے۔ HTML — بشمول exported CMS posts، اندرونی documentation، اور confidential page source — کبھی ہمارے سرورز تک نہیں پہنچتا۔
- XSS-safe by default: پیسٹ کیا گیا HTML turndown کے چلنے سے پہلے DOMPurify سے گزرتا ہے، اور preview pane
innerHTMLسے پہلے دوبارہ HTML کو DOMPurify سے چلاتا ہے، اس لیے<script>ٹیگز یاonerror=handlers والا markup پیسٹ کرنے سے inert preview اور صاف Markdown ملتا ہے۔ - GFM-complete:
<table>عناصر Markdown pipe tables میں بدلتے ہیں،<del>strikethrough میں، اور checkbox lists GFM task lists میں۔ زیادہ تر آن لائن کنورٹرز HTML → Markdown path پر tables گرا دیتے ہیں — بنڈل شدہturndown-plugin-gfmextension انہیں محفوظ رکھتا ہے۔
HTML to Markdown تبدیلی کے عام استعمال کیا ہیں؟
HTML کو Markdown میں تبدیل کرنا content migration، documentation، اور archiving میں نظر آتا ہے:
- CMS migration: WordPress یا Ghost پوسٹ کو HTML کے طور پر export کرنا اور Hugo / Jekyll / 11ty / Astro static-site rebuild کے لیے Markdown میں تبدیل کرنا۔ تبدیلی heading levels، links، lists، اور inline emphasis محفوظ رکھتی ہے۔
- README cleanup: wiki page یا web article کا رینڈر شدہ HTML پیسٹ کرنا اور project README یا docs site کے لیے قابل ترمیم Markdown میں واپس لانا، بجائے structure کو ہاتھ سے دوبارہ ٹائپ کرنے کے۔
- Archiving and notes: HTML email یا web clipping کو capture کرنا اور Obsidian، Notion، یا plain-text knowledge base میں ذخیرے کے لیے Markdown میں تبدیل کرنا — Markdown diff-friendly رہتا ہے اور format تبدیلیوں سے بچتا ہے۔
HTML to Markdown مثال کیسی دکھتی ہے؟
<h2>Heading</h2><ul><li>a</li><li>b<ul><li>nested</li></ul></li></ul> پیسٹ کرنے سے ## Heading، nested bullet list کے ساتھ Markdown ملتا ہے، اور preview pane اسی nested ساخت میں دوبارہ render ہوتا ہے۔ <table> کے ساتھ header row اور دو data rows پیسٹ کرنا مکافئ | col | col | pipe table پیدا کرتا ہے — جو تصدیق کرتا ہے کہ تبدیلی headings، lists، اور tables محفوظ رکھتی ہے۔
کیا یہ HTML to Markdown کنورٹر مکمل طور پر میرے براؤزر میں چلتا ہے؟
ہاں۔ ہر sanitize، convert اور render pass آپ کے براؤزر ٹیب کے اندر JavaScript کے طور پر مقامی طور پر چلتا ہے۔ بنڈل شدہ تین لائبریریاں — turndown@7.2.0 (turndown-plugin-gfm@1.0.2 کے ساتھ)، marked@12.0.2، اور DOMPurify@3.1.7 — صفحے کے ہی origin سے بھیجی جاتی ہیں، تو کوئی CDN انحصار نہیں، کوئی fetch نہیں، کوئی XMLHttpRequest نہیں، ان پٹ پر کوئی navigator.sendBeacon نہیں۔ ٹول صفحہ load ہونے کے بعد آف لائن بھی کام کرتا ہے، کیونکہ یہ ایک static HTML/CSS/JS بنڈل ہے جس کے ساتھ vendor لائبریریاں copy ہیں۔ Exported posts، اندرونی docs اور confidential READMEs آپ کے ڈیوائس پر رہتی ہیں۔
کیا رینڈر شدہ preview pane XSS-safe ہے؟
ہاں۔ پیسٹ کیا گیا HTML DOMPurify.sanitize سے گزرتا ہے قبل اس کے کہ turndown اس پر چلے، اور innerHTML پر سونپی جانے والی ہر HTML string پہلے DOMPurify.sanitize(html, { USE_PROFILES: { html: true } }) سے گزرتی ہے۔ DOMPurify وہ open-source XSS sanitizer ہے جسے Cure53 برقرار رکھتا ہے؛ یہ وہی لائبریری ہے جو Mozilla MDN، Atlassian اور Microsoft 365 صارف فراہم کردہ HTML کو سخت بنانے کے لیے استعمال کرتے ہیں۔ ڈیفالٹ html پروفائل <script> عناصر، ہر on* event-handler attribute (onerror، onclick وغیرہ)، javascript: URI schemes اور معروف خطرناک CSS expressions ہٹا دیتا ہے۔ <img src=x onerror=alert(1)> پیسٹ کرنا ایک preview پیدا کرتا ہے جہاں document.querySelector('#output-preview img[onerror]') null واپس کرتا ہے اور کوئی alert نہیں چلتا۔
کیا GFM tables HTML سے convert ہوتی ہیں؟
ہاں۔ HTML → Markdown direction turndown-plugin-gfm استعمال کرتی ہے، جو ایک custom turndown rule شامل کرتی ہے جو <table> nodes پر چلتی ہے اور برابر pipe-table Markdown نکالتی ہے — ایک header row، |---|---| alignment row، پھر data rows۔ زیادہ تر آن لائن کنورٹرز اس path پر tables گرا دیتے ہیں — یہ انہیں محفوظ رکھتا ہے۔ Strikethrough (<del>text</del> → ~~text~~) اور task lists (<input type="checkbox"> → - [ ] / - [x]) اسی طرح convert ہوتی ہیں۔
کیا میرا HTML صاف طور پر convert ہوگا؟
canonical GFM feature set کے لیے — headings h1 سے h6 تک، nesting کے ساتھ ordered اور unordered لسٹس، bold / italic / strikethrough، inline links، inline images، language tags کے ساتھ fenced code blocks، inline code spans، pipe tables، task lists، blockquotes، horizontal rules اور autolinks — تبدیلی صاف اور قابل پیشگوئی ہے۔ ایج کیسز: HTML comments (<!-- ... -->) ہٹا دیے جاتے ہیں (Markdown میں comment syntax نہیں)؛ inline styling اور class attributes حذف ہو جاتی ہیں کیونکہ Markdown میں کوئی مکافئ نہیں؛ اور غیر معمولی inline tags جیسے <sub> / <sup> plain text میں بدل جاتے ہیں۔ یہ documented turndown behaviours ہیں، bugs نہیں۔
کیا fenced code blocks میں syntax highlighting سپورٹ ہے؟
v1 میں نہیں۔ Fenced code blocks monospace فونٹ اور ہلکے background کے ساتھ render ہوتے ہیں لیکن per-language token highlighting کے بغیر۔ syntax highlighting شامل کرنے کے لیے Prism یا highlight.js کو bundle کرنا پڑے گا، جن میں سے ہر ایک 15–40 KB کے علاوہ per-language grammar فائل اور theme matrix شامل کرتا ہے جسے Workshop Terminal palette سے ہم آہنگ کرنا ہوگا۔ فی الحال renderer correctness اور XSS-safety پر فوکس کرتا ہے؛ اگر inline highlighting کے لیے user demand ہو، تو opt-in toggle ایک قابل عمل follow-up ہے۔
یہ HTML to Markdown کنورٹر turndown@7.2.0 (+ turndown-plugin-gfm@1.0.2)، marked@12.0.2، اور DOMPurify@3.1.7 کے ساتھ اسی origin پر bundle ہو کر آتا ہے، مکمل GFM feature set خارج کرتا ہے، اور ہر رینڈر شدہ HTML string کو DOM پر پہنچنے سے پہلے sanitize کرتا ہے۔ کوئی اپلوڈ نہیں، کوئی CDN نہیں، کوئی telemetry نہیں — ہر بائٹ آپ کے براؤزر میں رہتا ہے۔