lbokhidfopkdehkmlmpaabacljoediic
Renders plantuml code blocks directly on GitHub pages using the client-side TeaVM-compiled PlantUML engine. PlantUML for GitHub A Chrome extension that renders "plantuml" code blocks directly on GitHub pages, using the TeaVM-compiled PlantUML engine that runs entirely client-side. Hosted at https://github.com/plantuml/plantuml-for-github 1. The extension's content script scans every GitHub page for "plantuml" code blocks. 2. Each block is replaced with a sandboxed "" packaged inside the extension. 3. The iframe loads the TeaVM-compiled "plantuml.js" engine and renders the diagram to SVG. 4. The result is displayed inline in the page, inside a small wrapper with a header bar. 5. The header bar shows a toggle button (top-left of the wrapper) that switches between the rendered diagram and the original PlantUML source. The source view uses GitHub's own syntax highlighting, so it looks exactly as it would without the extension installed. This is the same architecture GitHub already uses for Mermaid — proving that client-side PlantUML can be integrated natively with zero infrastructure cost. SECURITY AND PERMISSIONS Minimal Permissions: It requires no host permissions, storage, or tabs API. The only declared permission is clipboardWrite, which is strictly used to power the user-triggered "Copy as Bitmap" button, allowing the generated diagram to be copied directly to the clipboard. One thing worth calling out is the extension's Content Security Policy. The Manifest V3 default CSP for extension pages is essentially "script-src 'self'", which blocks WebAssembly. We need to relax it slightly to enable WebAssembly. Why? PlantUML renders sequence diagrams directly to SVG, but anything that needs graph layout — class, component, deployment, state, use-case, and activity diagrams — is laid out by the embedded Graphviz engine, which ships as a WebAssembly module (viz-global.js). Instantiating that module requires the 'wasm-unsafe-eval' CSP source. 'wasm-unsafe-eval' is a narrowly scoped directive: despite the scary name, it ONLY allows WebAssembly compilation and instantiation. It does NOT re-enable "eval()" or "new Function()" — those remain blocked. No remote scripts can be loaded either; "script-src 'self'" still applies. Google documents this directive as the supported way to ship WASM in MV3 extensions. In short: the engine runs entirely inside a sandboxed iframe with an opaque origin, with no network access and no shared state with the host page. - [x] MVP: detect and render plantuml blocks - [x] Firefox support (Manifest V3 is now supported in Firefox) - [x] "Copy as Bitmap" buttons - [x] Theme matching (light/dark) — follows GitHub's color mode - [x] Support puml and wsd language aliases - [ ] Options page (toggle, performance settings) - [x] Chrome Web Store publication PlantUML support on GitHub has been requested for 4+ years: https://github.com/orgs/community/discussions/10111 The main blocker was performance and infrastructure cost. With the TeaVM-compiled engine, that blocker no longer exists. This extension demonstrates that PlantUML can run natively on GitHub.com with zero server-side changes — using the exact same sandbox pattern GitHub uses for Mermaid. If you'd like to see this integrated natively, please upvote the discussion: https://github.com/orgs/community/discussions/10111 Source code: https://github.com/plantuml/plantuml-for-github Discussion: https://github.com/orgs/community/discussions/10111
SparkChart: PlantUML & Mermaid Renderer
SparkChart for PlantUML and Mermaid rendering in the browser. Create, visualize, and edit diagrams with AI assistance. SparkChart: The Ultimate Text-to-Diagram Workspace SparkChart is a lightweight, high-performance extension for developers, architects, and technical writers who want to build professional diagrams without the friction of drag-and-drop tools. By treating "Diagrams as Code," SparkChart allows you to render complex visualizations instantly using industry-standard syntax. PlantUML: Create robust, UML-compliant sequence diagrams with a dedicated live editor and real-time preview. Mermaid.js: Full support for all Mermaid charts, including Flowcharts, Gantt charts, Entity Relationship Diagrams (ERD), Mind Maps, and User Journeys. Live Rendering: Watch your diagrams update in real-time as you type your code. Professional Templates: Kickstart your project with built-in snippets for common architectural patterns. High-Quality Export: Save your work as SVG or PNG files for seamless integration into GitHub, Jira, Notion, or your internal documentation. Privacy-First: Your diagram code stays in your browser. No external accounts or cloud storage required. ## Future-Ready with Local AI SparkChart is built for the next generation of web browsing. We have integrated a powerful AI assistant designed to generate diagrams from natural language prompts and automatically refactor your chart logic. Note: These AI features are currently deactivated. They will be automatically enabled as soon as Google Chrome rolls out official support for Gemini Nano (Built-in AI) on your device. This ensures the AI runs entirely locally on your machine, keeping your data 100% private. Stop drawing. Start coding. Ignite your documentation with SparkChart.
PlantUML Preview - Azure DevOps & GitHub
Visualize diagramas PlantUML diretamente no Azure DevOps, GitHub e outros editores. Suporte para C4, UML, ER. Testado para arquivos .puml no Azure DevOps
Từ điển Anh Việt ENVI
Tra từ điển Anh Việt, dịch mọi ngôn ngữ ngay trên trang web với Từ điển ENVI Click vào icon của tiện ích để bật/tắt chức năng và xem hướng dẫn. 1) Tra cứu khi bôi đen Bôi đen tiếng Anh để tra cứu nhanh. - Tra từ vựng với ví dụ và giải thích. - Dịch đoạn văn. - Tra động từ/tính từ bất quy tắc - Phát âm từ vựng và ví dụ. - Click vào từ vựng trên Popup để tra nhanh. 2) Dịch nhanh khi di chuột Di chuột đến văn bản để dịch. 3) Tra cứu bằng chuột phải Bôi đen văn bản → Nhấn chuột phải → Nhấn "Tìm kiếm trên Từ điển ENVI" để tra từ và dịch đoạn văn. 4) Tra cứu trên thanh tìm kiếm Trên thanh tìm kiếm của trình duyệt, gõ "envi" + dấu cách → nhập từ hoặc nội dung cần tra. Mẹo sử dụng hiệu quả: - Nhấn vào từ vựng, Xem bình luận trên Popup để xem chi tiết từ vựng và bình luận. - Double click để bôi đen từ, triple click để bôi đen câu. - Nhấn giữ Alt để bôi đen link. - Nếu bạn dùng Edge, có thể dùng phím tắt Ctrl Shift + X để copy button hay những phần chặn copy, sau đó tra cứu trên thanh tìm kiếm (gõ "envi" + dấu cách → paste nội dung đã copy) để tra nhanh. - Từ điển ENVI có thể nhận dạng chữ viết tay, nhận dạng hình ảnh. Hãy truy cập envi.jpdictionary.com để sử dụng tính năng. Chúc bạn học tốt với tiện ích tra nhanh của Từ điển Anh Việt, từ điển tiếng Anh ENVI 📕😊 Website: https://envi.jpdictionary.com
Eglador Validation
This validator checks the validity of Web documents in HTML. Eglador Validation scans your Web pages and presents you with information on various topics. You can easily access detailed results about Page, Meta, Style, Script, Assets, Seo and more. Thus, it will greatly help you to improve and gain knowledge on topics such as SEO Optimization, Page Performance, Validation. (1) Tracking It checks the tracking codes of platforms such as Google Analytics, Gemius, Hotjar on the page. (2) Response It gives you various server-side information of your page with information such as XMLHttpRequest (cache-control, content-encoding, content-type, content-security-policy, expires, server, etc.). It gives you various information on the browser side of your page with information such as UserAgent (appName, appVersion, platform, platform, vendor). (3) Meta It scans the information such as Html Tag, Meta Tag (Description, Keywords, Twitter, Og, Viewport, Copyright, Author etc.) on the page and finds missing or incorrect ones. (4) Link It finds all Attributes of the Link Tag on the page and returns the incorrect ones, if any. (5) Base It finds all Attributes of the Base Tag on the page and returns the incorrect ones, if any. (6) Url It gives attribute controls and response status by scanning all the URLs on the page and making a request. (7) Image It scans all the images on the page and sends a request, giving attribute controls and response statuses. (8) Style It scans all the Styles on the page and sends the request, giving the attribute controls and response statuses. (9) Scripts It scans all Scripts on the page and sends requests, giving attribute controls and response statuses. (10) Fonts It finds all the Fonts on the page and gives information such as font-family, font-size, font-weight. (11) Color Returns all the colors found on the page. (12) Heading It finds all Heading Tags on the page and shows how many of each are used. (13) Robots Txt Checks the Robots Txt File on the page. (14) Structured Data It scans the data structures on the page and checks the data. You can view the change-log for every version update at https://eglador.github.io/validation
