การเรียงอันดับ

การทำให้เป็นอนุกรมจะบันทึกสถานะของพื้นที่ทำงานเพื่อให้สามารถโหลดกลับไปยังพื้นที่ทำงานได้ในภายหลัง ซึ่งรวมถึงการจัดลำดับสถานะของการบล็อก ตัวแปร หรือปลั๊กอินที่คุณต้องการบันทึก คุณสามารถแปลงข้อมูลทั้งหมดที่ต้องการบันทึกเป็นรูปแบบข้อความเพื่อให้จัดเก็บได้ง่าย จากนั้นโหลดข้อมูลนั้นกลับไปที่พื้นที่ทำงานที่ทำงานได้อย่างสมบูรณ์ในภายหลัง

Blockly มี 2 รูปแบบสำหรับข้อมูลนี้ ได้แก่ JSON และ XML เราขอแนะนำให้ใช้ระบบ JSON สำหรับโปรเจ็กต์ใหม่ และสนับสนุนให้โปรเจ็กต์เก่าใช้ XML ในการอัปเกรด ระบบ XML เป็นรูปแบบการบันทึกแบบเดิม จะไม่มีการนำออก แต่ จะไม่ได้รับฟีเจอร์ใหม่

ระบบ JSON

ระบบการทำให้เป็นอนุกรม JSON ประกอบด้วยตัวซีเรียลไลเซอร์หลายตัว มีตัวซีเรียลไลเซอร์ในตัวสำหรับบล็อกและตัวแปร และคุณยังลงทะเบียนซีเรียลไลเซอร์เพิ่มเติมได้ด้วย ซีเรียลไลเซอร์แต่ละตัวมีหน้าที่ในการต่อเนื่องและดีซีเรียลสถานะของปลั๊กอินหรือระบบหนึ่งๆ

การบันทึกและการโหลด

พื้นที่ทำงาน

คุณทำให้สถานะของพื้นที่ทำงานทั้งหมดเป็นอนุกรมหรือดีซีเรียลไลซ์ได้โดยเรียกใช้เมธอด save และ load ในเนมสเปซ workspaces

const state = Blockly.serialization.workspaces.save(myWorkspace);
Blockly.serialization.workspaces.load(state, myWorkspace);

การเรียกเหล่านี้ทำให้เป็นอนุกรมหรือดีซีเรียลไลซ์ของแต่ละระบบทั้งหมด (แสดงโดยตัวซีเรียลไลเซอร์) ที่ลงทะเบียนกับพื้นที่ทำงาน

บล็อกเดี่ยว

คุณทำให้อนุกรมหรือดีซีเรียลไลซ์บล็อกแต่ละรายการได้โดยเรียกใช้เมธอด save และ append ในเนมสเปซ blocks

const blockJson = Blockly.serialization.blocks.save(myBlock);
const duplicateBlock =
    Blockly.serialization.blocks.append(blockJson, myWorkspace);

ระบบส่วนบุคคล

คุณสามารถทำให้เป็นอนุกรมหรือดีซีเรียลไลเซอร์ของระบบแต่ละรายการ (เช่น บล็อก ตัวแปร ปลั๊กอิน ฯลฯ) โดยการสร้างซีเรียลไลเซอร์ที่เกี่ยวข้องและเรียกเมธอด save และ load

// Saves only the variables information for the workspace.
const serializer = new Blockly.serialization.variables.VariableSerializer();
const state = serializer.save(myWorkspace);
serializer.load(state, myWorkspace);

ลำดับการแยกซีเรียล

ระบบ JSON มีลำดับการแยกซีเรียลที่ชัดเจน ซึ่งช่วยให้การป้องกันสถานะซ้ำกันภายในการบันทึกทำได้ง่ายขึ้น

เมื่อมีการเรียก Blockly.serialization.workspaces.load ตัวซีเรียลไลซ์จะได้รับสถานะให้ดีซีเรียลไลซ์ตามลำดับความสำคัญ ซึ่งจะอธิบายเพิ่มเติมในส่วน Serializers และมีจุดประสงค์เพื่อให้ตัวซีเรียลไลเซอร์ขึ้นต่อสถานะจากระบบอื่น

ลำดับการดีซีเรียลไลเซอร์ของเครื่องซีเรียลในตัวมีดังนี้

  1. ตัวแปรจะได้รับการดีซีเรียลไลซ์
  2. การบล็อกมีการดีซีเรียลไลซ์ สแต็ก/บล็อกระดับบนสุดแต่ละรายการจะถูกดีซีเรียลไลซ์ตามลำดับที่กำหนดเอง
    1. ประเภทมีการดีซีเรียลไลซ์ ซึ่งจะทริกเกอร์เมธอด init ของการบล็อก การผสมส่วนขยายในส่วนขยาย เป็นต้น
    2. แอตทริบิวต์ได้รับการดีซีเรียลไลซ์ ซึ่งรวมถึงพร็อพเพอร์ตี้ ที่ใช้กับการบล็อก เช่น x, y, ยุบ, ปิดใช้, ข้อมูล ฯลฯ
    3. สถานะเพิ่มเติมจะถูกดีซีเรียลไลซ์ โปรดดูข้อมูลเพิ่มเติมในเอกสารประกอบส่วนขยายและเครื่องมือเปลี่ยนแปลง
    4. การบล็อกเชื่อมต่อกับระดับบนสุด (หากมี)
    5. ไอคอนมีการดีซีเรียลไลซ์ ไอคอนแต่ละรายการจะได้รับการดีซีเรียลไลซ์ตามลำดับที่กำหนดเอง
    6. ช่องได้รับการดีซีเรียลไลซ์ ช่องแต่ละช่องจะได้รับการดีซีเรียลไลซ์ตามคำสั่งที่กำหนดเอง
    7. บล็อกอินพุตมีการดีซีเรียลไลซ์ ซึ่งรวมถึงบล็อกที่เชื่อมต่อกับ อินพุตค่าและอินพุตคำสั่ง อินพุตแต่ละรายการจะได้รับการดีซีเรียลไลซ์ตามคำสั่งที่กำหนดเอง
    8. บล็อกถัดไปจะมีการดีซีเรียลไลซ์

ควรบันทึกสถานะเพิ่มเติมเมื่อใด

สำหรับการบล็อก หากคุณมีข้อมูลที่ต่ำกว่าในลำดับที่ขึ้นอยู่กับลำดับที่สูงกว่า คุณควรทำซ้ำข้อมูลดังกล่าวและเพิ่มลงในสถานะเพิ่มเติม

เช่น หากคุณมีช่องอยู่เฉพาะในกรณีที่บล็อกถัดไปเชื่อมต่ออยู่ คุณควรเพิ่มข้อมูลเกี่ยวกับบล็อกถัดไปนั้นลงในสถานะพิเศษ เพื่อให้สามารถเพิ่มช่องลงในบล็อกได้ก่อนที่สถานะของช่องดังกล่าวจะถูกดีซีเรียลไลซ์

อย่างไรก็ตาม หากคุณมีอินพุตที่ใช้ได้ต่อเมื่อช่องมีค่าที่กำหนดเท่านั้น คุณไม่จำเป็นต้องเพิ่มข้อมูลเกี่ยวกับช่องนั้นลงในสถานะพิเศษ ทั้งนี้เนื่องจากระบบจะดีซีเรียลไลซ์สถานะของช่องก่อน และเมื่อเชื่อมต่อแล้ว คุณจึงเพิ่มอินพุตลงในบล็อกได้ โดยปกติแล้ว validatorจะทริกเกอร์การเพิ่มอินพุต

โปรดทราบว่ากฎเกี่ยวกับสถานะการทำซ้ำควรคำนึงด้วยว่ามีการบล็อกสแต็ก ไอคอน ช่อง และบล็อกอินพุตที่มีการดีซีเรียลตามลำดับที่กำหนดเอง เช่น หากมีช่อง B อยู่ 1 ช่องก็ต่อเมื่อช่อง A อีกช่องหนึ่งมีค่าที่กำหนด คุณควรเพิ่มข้อมูลเกี่ยวกับ A ลงในสถานะเพิ่มเติมในกรณีที่ B ได้รับการดีซีเรียลไลซ์ไว้ก่อน A

แบบบล็อกตะขอ

ดูวิธีเพิ่มการเรียงอันดับเพิ่มเติมลงในบล็อกได้ในเอกสารประกอบส่วนขยายและเครื่องมือเปลี่ยนแปลง

ตะขอเกี่ยว

ดูข้อมูลเกี่ยวกับวิธีทำให้ช่องเป็นอนุกรมได้ในเอกสารประกอบเกี่ยวกับช่องที่กำหนดเอง

ตะขอสำหรับซีเรียลไลเซอร์

ระบบ JSON ช่วยให้คุณลงทะเบียนซีเรียลไลเซอร์ซึ่งจะต่อเนื่องและดีซีเรียลไลซ์บางสถานะ ตัวซีเรียลไลเซอร์ในตัวของ Blockly จะดูแลการทำให้ข้อมูลเป็นอนุกรมเกี่ยวกับบล็อกและตัวแปร แต่หากต้องการทำให้ข้อมูลอื่นๆ เป็นอนุกรม คุณจะต้องเพิ่มตัวซีเรียลไลเซอร์ของคุณเอง ตัวอย่างเช่น ระบบ JSON ไม่ได้ทำให้ความคิดเห็นระดับพื้นที่ทำงานเป็นอนุกรมโดยค่าเริ่มต้น หากต้องการทำให้เป็นอนุกรม คุณจะต้องลงทะเบียนซีเรียลไลเซอร์เพิ่มเติม

ตัวซีเรียลไลเซอร์เพิ่มเติมมักใช้ในการเรียงอันดับและดีซีเรียลไลซ์สถานะของปลั๊กอิน

Blockly.serialization.registry.register(
    'workspace-comments',  // Name
    {
      save: saveFn,      // Save function
      load: loadFn,      // Load function
      clear: clearFn,    // Clear function
      priority: 10,      // Priority
    });

เมื่อคุณลงทะเบียนซีเรียลไลเซอร์ คุณจะต้องให้สิ่งต่างๆ ต่อไปนี้:

  • ชื่อสำหรับตัวซีเรียลไลเซอร์ที่มีข้อมูลบันทึกไว้ด้วย
  • ฟังก์ชันในการsaveสถานะของปลั๊กอิน/ระบบที่เชื่อมโยงกับตัวซีเรียลไลเซอร์
  • ฟังก์ชันเพื่อ clear สถานะ
  • ฟังก์ชันเพื่อ load สถานะ
  • priority ที่ใช้กำหนดลำดับการแยกซีเรียล

    คุณสามารถกำหนดลำดับความสำคัญของตัวซีเรียลไลเซอร์ตามลำดับความสำคัญในตัว

เมื่อเรียก Blockly.serialization.workspaces.save ระบบจะเรียกใช้ฟังก์ชัน save ของซีเรียลไลเซอร์แต่ละตัวและเพิ่มข้อมูลไปยังเอาต์พุต JSON สุดท้าย ดังนี้

{
  "blocks": { ... },
  "workspaceComments": [ // Provided by workspace-comments serializer
    {
      "x": 239,
      "y": 31,
      "text": "Add 2 + 2"
    },
    // etc...
  ]
}

เมื่อมีการเรียก Blockly.serialization.workspaces.load ซีเรียลไลเซอร์แต่ละตัวจะทริกเกอร์ตามลำดับความสำคัญ จะมีการทริกเกอร์ตัวซีเรียลไลเซอร์ที่มีค่าลำดับความสำคัญเป็นบวกมากกว่าก่อนทำให้ซีเรียลไลเซอร์ที่มีค่าลำดับความสำคัญเป็นบวกน้อยกว่า

เมื่อมีการทริกเกอร์ซีเรียลไลเซอร์ 2 สิ่งต่อไปนี้จะเกิดขึ้น

  1. ระบบจะเรียกใช้ฟังก์ชัน clear ที่ระบุ การทำเช่นนี้จะทำให้สถานะของปลั๊กอิน/ระบบของคุณสะอาดก่อนที่จะโหลดสถานะเพิ่มเติม เช่น ตัวซีเรียลไลเซอร์บน workspace-comments จะนำความคิดเห็นที่มีอยู่ทั้งหมดออกจากพื้นที่ทำงาน
  2. ระบบจะเรียกใช้ฟังก์ชัน load ที่ระบุ

ระบบ XML

ระบบ XML ช่วยให้คุณกำหนดลำดับพื้นที่ทำงานไปยังโหนด XML ได้ นี่เป็นระบบการทำให้เป็นอนุกรมดั้งเดิมของ Blockly ตอนนี้ได้กลายเป็นกล่องน้ำแข็ง ซึ่งหมายความว่าจะไม่มีฟีเจอร์ใหม่ๆ อีก ดังนั้น เราขอแนะนำให้ใช้ระบบ JSON หากเป็นไปได้

API

โปรดดูข้อมูลเกี่ยวกับ API ของระบบ XML ในเอกสารอ้างอิง

แบบบล็อกตะขอ

ดูวิธีเพิ่มการเรียงอันดับเพิ่มเติมลงในบล็อกได้ในเอกสารประกอบส่วนขยายและเครื่องมือเปลี่ยนแปลง

ตะขอเกี่ยว

ดูข้อมูลเกี่ยวกับวิธีทำให้ช่องเป็นอนุกรมได้ในเอกสารประกอบเกี่ยวกับช่องที่กำหนดเอง

การเลือกระหว่าง JSON และ XML

เราขอแนะนำให้ใช้ซีเรียลไลเซอร์ JSON แทน XML ระบบ JSON ช่วยให้คุณจัดเรียงสถานะพื้นที่ทำงานให้เป็นออบเจ็กต์ JavaScript ได้ ซึ่งมีข้อดีดังนี้

  1. JSON นั้นบีบอัดหรือแปลงเป็นรูปแบบอื่นได้ง่าย
  2. JSON นั้นทำงานด้วยการเขียนโปรแกรมได้ง่าย
  3. JSON นั้นขยายและต่อท้ายข้อมูลได้ง่าย

นอกจากนี้ ระบบ XML จะไม่ได้รับการอัปเดตอีกและจะไม่มีฟีเจอร์เมื่อเทียบกับตัวซีเรียลไลเซอร์ JSON อยู่แล้ว ตัวอย่างเช่น คุณสามารถลงทะเบียนตัวซีเรียลไลเซอร์ JSON ของคุณเองเพื่อบันทึกและโหลดข้อมูลเพิ่มเติมได้ง่ายๆ เช่น ข้อมูลสำหรับปลั๊กอินหรือการปรับแต่งที่คุณเพิ่มไว้ วิธีนี้ทำไม่ได้ในระบบ XML

หากคุณเคยใช้การทำให้เป็นอนุกรม XML มาก่อน โปรดดูข้อมูลเกี่ยวกับวิธีอัปเกรดในคู่มือการย้ายข้อมูล