Kaynak kodunu şemalarla açıklama olarak ekleyin

Hesaplamalı geometri ve grafiklere ve bu tür konulara değinen bir sürü (öncelikle c ++ ve javascript) kodları yazıyorum, bu yüzden görsel diyagramların problem çözme sürecinin vazgeçilmez bir parçası olduğunu gördüm.

Hemen şimdi "oh, bir şekilde bir kod parçasına elle çizilmiş bir diyagramı yorum olarak ekleyebilirsem harika olmaz mıydı" dedim ve bu benim üzerinde çalıştığım bir şeye geri dönmeme izin verecekti, günler, haftalar, aylar önce ve çok daha hızlı bir şekilde algoritmalarımı yeniden oluşturdum.

Görsel bir öğrenci olarak, bunun neredeyse her tür programlama ile verimliliğimi geliştirme potansiyeline sahip olduğunu hissediyorum, çünkü basit diyagramlar her türlü önemsiz olmayan veri yapısının anlaşılmasına ve akıl yürütmesine yardımcı olabilir. Örneğin grafikler. Üniversitedeki grafik teorisi dersinde, gerçekte diyagramatik temsiller çizebildiğim grafik ilişkilerini gerçekten anlayabildim.

Yani...

Bildiğim hiçbir IDE, bir resmi kod için yorum olarak kaydetmenize izin vermez.

Benim ya da bir başkasının, daha sonra koduma ekleyebileceğim bir base64 ikili dizeye bir görüntüyü dönüştürebilen bazı kullanımı kolay bir araç ile gelebileceği düşünülüyordu.

Dönüşüm / ekleme işlemi yeterince basitleştirilebilirse, diyagram ve gerçek kod arasında çok daha iyi bir bağlantıya izin verir, bu yüzden artık defterlerimde kronolojik olarak arama yapmam gerekmiyor. Daha da müthiş: IDE'lerin görüntüyü otomatik olarak ayrıştırması ve görüntülemesi için eklentiler. Teorik açıdan bu konuda kesinlikle zor bir şey yoktur.

Benim tahminim, en sevdiğim IDE'leri nasıl uzatacağımı ve bu eklentileri nasıl koruyacağımı anlaması benim için biraz zaman alacaktır, bu yüzden aynı ayrışmayı yapacak bir tür kod post-işlemci ile tamamen mutlu olurum ve görüntülerin oluşturulması ve kodla, tarayıcının içinde veya başka bir şeyle yan yana gösterilmesi. Ben ticaretle bir javascript programcısı olduğum için.

İnsanlar ne düşünüyor? Herkes bunun için ödeme yapar mıydı? İsterim. Ama belki de akranlarımın ya da bir kısmının böyle bir şey için para ödeyip ödemeyeceğine bakılmaksızın, böyle bir şeyin başarılı olmasının tek yolunun açık kaynak sürümüyle olacağını belirtmek isterim.

Visual Studio için Image Insertion eklentisi ne olacak ?

Farklı bir IDE kullanıyorsanız ve ya gömülü görüntüleri desteklemiyorsa veya genişletmek için zamanınız yoksa, görüntü depoda bir yerde bulunurken yorumlarda bir görüntüye bağlantı koymak ne olacak? ?

Eğer değilseniz ASCII sanatçı , kullanabilirsiniz doxygen birlikte dokümantasyon aracı olarak nokta / graphviz buna entegre.

Bu, grafiklerin metinsel tanımlarının yazılmasına ve dokümantasyonda oluşturulmasına izin verir.

Örneğin, bu açıklama:

digraph finite_state_machine {
    rankdir=LR;
    size="8,5"
    node [shape = doublecircle]; LR_0 LR_3 LR_4 LR_8;
    node [shape = circle];
    LR_0 -> LR_2 [ label = "SS(B)" ];
    LR_0 -> LR_1 [ label = "SS(S)" ];
    LR_1 -> LR_3 [ label = "S($end)" ];
    LR_2 -> LR_6 [ label = "SS(b)" ];
    LR_2 -> LR_5 [ label = "SS(a)" ];
    LR_2 -> LR_4 [ label = "S(A)" ];
    LR_5 -> LR_7 [ label = "S(b)" ];
    LR_5 -> LR_5 [ label = "S(a)" ];
    LR_6 -> LR_6 [ label = "S(b)" ];
    LR_6 -> LR_5 [ label = "S(a)" ];
    LR_7 -> LR_8 [ label = "S(b)" ];
    LR_7 -> LR_5 [ label = "S(a)" ];
    LR_8 -> LR_6 [ label = "S(b)" ];
    LR_8 -> LR_5 [ label = "S(a)" ];
}

olarak oluşturur:

Emacs sanatçı modunu deneyebilirsiniz. Kendi başına resimlerden ziyade ascii sanatı yapar, bu yüzden aradığınız şey olabilir veya olmayabilir. Özellikle, IDE'niz sabit genişlikli yazı tipleri kullanmıyorsa yararlı olmaz. Düz metin olarak, sürüm kontrolü ile çok güzel oynardı.

İşte kullanılan sanatçı modunun bir ekran görüntüsü , böylece ilgilenip ilgilenmediğiniz hakkında bir fikir edinebilirsiniz.

Sanatçı modunu emac'larda başlatmak için Alt-x yapın, sanatçı modu yazın ve return tuşuna basın. Orta fare düğmesi menüyü getirir. Kes ve yapıştır için tuş bağları varsayılan olarak normal pencereler değildir, ancak bunu değiştirmek için CUA modunu açabilirsiniz.

İnsanlar ne düşünüyor? Herkes bunun için ödeme yapar mıydı? İsterim.

ZOMG, sizinle benzer bir kategoriye uyuyorum ve doğrudan IDE'de böyle bir özelliği seveceğim.

Şimdilik sadece ASCII "sanat" gibi bir sürü yapmak eğilimindedir:

// ******************************************************
// *v3            |e5          v4*           |e6      v6*
// *              |              *           |          *
// *              |              *           |          *
// *              |              *           |          *
// *              |              *           |p1        *
// *              |            e1*-----------~----------*
// *              |              *           |          *
// *              |              *           |          *
// *              |              *           |          *
// *              |              *           |          *
// *cen           |p0          v0*           |        v5*
// *--------------~--------------************************
// *e4            |              *           |e7        *
// *              |              *           |          *
// *              |              *           |          *
// *              |              *           |          *
// *              |              *           |p2        *
// *              |            e2*-----------~----------*
// *              |              *           |          *
// *              |              *           |          *
// *              |              *           |          *
// *              |              *           |          *
// *v2            |e3          v1*           |e8      v7*
// ******************************************************

Bulduğum ana değer, görsel şemaya karşılık gelen değişken adlarını, özellikle de yeni mesh algoritmaları için meshlerin karmaşık çapraz geçişlerini kullandığımızda görmektir. Cevaplardan birinde gösterilen bu doxygen grafik oluşturma hilesi süper havalı - bunu daha fazla denemeliyim.

Grafikleri bile kullanmak zorunda değilsiniz, görsel olarak da iletişim kurmak daha kolay olan birçok şey var. Misal:

... ya da bu (benim algoritmamın karşılaştırması "kanca alt bölümü" Pixar tarafından kullanılan standart CC alt bölümüyle karşılaştırıyorum):

Bu işlemlerin ne yaptığını ve kod içinde nasıl farklı olduklarını görmek için koda çok fazla bağlam verirdi, çünkü bazı şeyler en iyi görsel olarak gösterilir. Resimler gerçekten bin kelimeyi yakalayabilir.

Bu yüzden, kodları ve görüntüleri yan yana görmeme ve görüntüleri kaynak koduna yerleştirmeme izin veren bir IDE'ye sahip olmak benim için tamamen rüya gibi olurdu.

Özellikle yeni algoritmalar icat ettiğimizde, algoritmik adımlarına girmeden bunları çok doğru bir şekilde (teknik bir perspektiften, tam olarak kullanıcı perspektifinden değil) tanımlamak için iyi bir yol bulmak zordur, çünkü bunları doğrudan karşılaştırmak için hiçbir şey yoktur. Bu tür öncesi ve sonrası görüntüler algoritmadan hemen ne beklediğinizi tamamen gösterme eğilimindedir.

Hayal ettiğim başka bir şey, veri türlerimin bazılarının hata ayıklayıcıya bir görüntü çıkmasını sağlayabilmem için görsel bir hata ayıklayıcıdır, örneğin, kodda adım attığımda ve algoritmalardan emin olduğumdan sonuçları görsel olarak görmek için Her adımda doğru çalıştığımı ve kağıda nasıl çizdiğimi eşleştirdiğimi icat etmeye çalışıyorum. Örneğin, ağ veri yapımı hata ayıklayıcı izleme penceresinde işlenmiş bir görüntü çıktısı yap - görünümü ve hatta o anda orada bile döndürürsem idealdir.

Ayrıca, binlerce eklentiye sahip gevşek ekipler tarafından yazılan çok büyük ölçekli kod tabanlarında (on milyonlarca LOC) çalışırken, bazen biraz karanlık için baktığımız kodun nasıl yürütüleceğini anlamak bir kabus olabilir, UI'den nadiren kullanılan eklenti. Kod, bu kodu kullanıcı arayüzünden gerçekten nasıl çağıracağınızı gösteren minyatür bir ekran görüntüsü gömebilirse çok harika olurdu (zaman zaman güncelliğini yitirmeye meyilli olabilir, ancak genellikle UI'ler arasında çok kararsız değildir önceki ekran görüntülerini işe yaramaz hale getirecek şekilde).

Herkes bunun için ödeme yapar mıydı? İsterim.

Her neyse, evet, tamamen! Bunu istiyorum!!!

Belgelerinize diyagramlar ve her şeyi ekleyebileceğiniz Literate Programming için bir kullanım örneği gibi geliyor .

Doxygen, aşağıdaki gibi yorumlara yorum eklemenize izin verir :

  /*! Here is a snapshot of my new application:
   *  \image html application.jpg
   */

Ne yazık ki hiçbir IDE bu satır içi görüntüler görüntüler gibi görünüyor, ama bunun gibi bir VSCode uzantısı yazmak için çok zor olmayacağından şüpheleniyorum.

Ayrıca zaten farklı bir sözdizimi commentimg ile destekleyen bir VSCode uzantısı buldum . Bunu bir fareyle üzerine gelin:

VSCode, satır içi resimlere izin veren bir özellik ekliyor - "kod yerleştirme" - ancak henüz hazır görünmüyor.

Örnek uzantıdan bir ekran görüntüsü (aslında bulamadım - kod yerleştirme API'sı henüz yayınlanmadığı için muhtemelen henüz yayınlanmadı)