A quantum cloud platform front-end development method

Abstract

The invention discloses a quantum cloud platform front-end development method, which relates to the technical field of front-end development. While performing circuit programming on a front-end page, language programming is edited to generate QASM code, the QASM code is parsed into a front-end code, and SVG is used on the front-end page to perform front-end layout rendering for the front-end code. The defect that the quantum computing cloud platform has only the circuit programming function in its display mode to users is improved, the language programming function of the quantum computing cloud platform is added, and the user experience is improved.

Description

Technical Field

[0001] The invention discloses a front-end development method, which relates to the technical field of front-end development, and specifically to a front-end development method for a quantum cloud platform. Background Art

[0002] A quantum computer is a computing system composed of quantum chips and external measurement and control systems. Quantum operations require data interaction between the front-end and back-end to make the results of each experiment more intuitively displayed to users and to implement data operations. However, most of the current quantum computing cloud platforms only have circuit programming functions, which is not very friendly to users who are familiar with circuit language programming but not familiar with circuit quantum gate operations. Summary of the invention

[0003] In view of the problems of the prior art, the present invention provides a quantum cloud platform front-end development method, which performs front-end development by combining circuit programming and language programming.

[0004] The specific scheme proposed by the present invention is:

[0005] A quantum cloud platform front-end development method includes editing language programming to generate QASM code while programming the front-end page circuit, parsing the QASM code into front-end code, and using SVG to render the front-end layout on the front-end page for the front-end code.

[0006] Preferably, in the quantum cloud platform front-end development method, the front-end page is modified by changing the QASM code through corresponding operations, and the front-end layout is re-rendered using svg for the front-end page.

[0007] Preferably, when a deletion operation is performed in the quantum cloud platform front-end development method, the QASM code of the quantum bit to be deleted in the language programming is determined, the corresponding code is deleted, and the front-end layout is rendered again using svg on the front-end page;

[0008] When performing the insertion operation, determine the insertion position of the quantum bit, insert the corresponding QASM code in the language programming, re-parse the QASM code, obtain the front-end code, and re-use svg to render the front-end layout of the front-end page.

[0009] Preferably, in the quantum cloud platform front-end development method, operations are performed on quantum gates of circuit programming, the storage arrays of the quantum gates are re-divided, the storage arrays are traversed, the storage arrays are displayed in QASM code format, and svg is used for front-end layout rendering.

[0010] A quantum cloud platform front-end development system, including an editing module, a parsing module and a layout module.

[0011] While the editing module is programming the front-end page circuit, it edits the language programming to generate QASM code. The parsing module parses the QASM code into the front-end code. The layout module uses svg to render the front-end layout on the front-end page based on the front-end code.

[0012] Preferably, in the quantum cloud platform front-end development system, the editing module modifies the front-end page by changing the QASM code through corresponding operations, and the layout module re-renders the front-end layout of the front-end page using svg.

[0013] Preferably, when the editing module in the quantum cloud platform front-end development system performs a deletion operation, the QASM code of the quantum bit to be deleted in the language programming is determined, the corresponding code is deleted, and the layout module re-uses SVG to render the front-end layout of the front-end page;

[0014] When the editing module performs an insertion operation, it determines the insertion position of the quantum bit and inserts the corresponding QASM code in the language programming. The parsing module re-parses the QASM code to obtain the front-end code, and the layout module re-uses SVG to render the front-end layout of the front-end page.

[0015] Preferably, in the quantum cloud platform front-end development system, the editing module operates on the quantum gates of circuit programming, re-divides the storage arrays of the quantum gates, traverses the storage arrays, and displays the storage arrays in QASM code format, and the layout module uses svg to render the front-end layout.

[0016] The benefits of the present invention are:

[0017] The present invention provides a quantum cloud platform front-end development method. While performing circuit programming on a front-end page, language programming is edited to generate QASM code, the QASM code is parsed into a front-end code, and SVG is used on the front-end page to perform front-end layout rendering for the front-end code. The defect that the quantum computing cloud platform only has the circuit programming function for displaying to users is improved, the language programming function of the quantum computing cloud platform is added, and the user experience is improved. BRIEF DESCRIPTION OF THE DRAWINGS

[0018] Figure 1 It is a schematic diagram of the circuit programming and language programming process in the method of the present invention;

[0019] Figure 2 It is a schematic diagram of the circuit programming and language programming rendering page in the present invention;

[0020] Figure 3 yes Figure 2 Schematic diagram of the editing QASM code page;

[0021] Figure 4 When performing a delete operation, the circuit programming and language programming pages render schematic diagrams;

[0022] Figure 5 yes Figure 4 Schematic diagram of the editing QASM code page;

[0023] Figure 6 Schematic diagram of page rendering when editing code in the QASM editor;

[0024] Figure 7 yes Figure 6 Schematic diagram of the Edit QASM Code page. DETAILED DESCRIPTION

[0025] A quantum computer is a new type of computer based on quantum theory. It is a physical device that follows the laws of quantum mechanics to perform high-speed mathematical and logical operations, store and process quantum information. The concept of a quantum computer originates from the study of reversible computers. Quantum computers use quantum bits, which can be in multiple states at the same time, unlike traditional computers that can only be in a binary state of 0 or 1.

[0026] The present invention is further described below in conjunction with the accompanying drawings and specific embodiments so that those skilled in the art can better understand the present invention and implement it, but the embodiments are not intended to limit the present invention.

[0027] The present invention provides a quantum cloud platform front-end development method. While performing front-end page circuit programming, language programming is edited to generate QASM code, the QASM code is parsed into front-end code, and SVG is used on the front-end page to perform front-end layout rendering for the front-end code.

[0028] The method of the present invention can improve the defect that the quantum computing cloud platform only has the circuit programming function for displaying to users, increase the language programming function of the quantum computing cloud platform, and improve the user experience.

[0029] In some embodiments of the specific application of the present invention, first, the circuit programming is displayed on the front-end page, where the lines and graphics can be rendered using svg vector graphics, the area where the quantum circuit diagram is placed uses svg tags, and then the quantum bit gate inside is presented on the front end using circle, rect, g and line-specific vector graphics tags;

[0030] At the same time, the language programming edit box uses the codemirror plug-in to delete and insert QASM codes; and through the corresponding operations, the QASM code is changed to modify the front-end page, and the front-end page is re-rendered using svg for the front-end layout.

[0031] When performing the deletion operation, the QASM code of the quantum bit to be deleted in the language programming is determined, the corresponding code is deleted, and the front-end page is re-rendered using SVG for the front-end layout;

[0032] When performing the insertion operation, determine the insertion position of the quantum bit, insert the corresponding QASM code in the language programming, re-parse the QASM code, obtain the front-end code, and re-use svg to render the front-end layout of the front-end page.

[0033] On the basis of the above embodiment, the specific operation during circuit programming is as follows: when operating the quantum gate of circuit programming, adding events of mouse pressing, moving and releasing to the quantum gate element, adding and copying the currently dragged quantum gate element when the mouse is pressed, adding an event of obtaining the coordinates of the quantum gate when moving, and judging the position and the previous and next elements, adding elements in the array, rendering the code in the array in language programming, and re-rendering the circuit programming when the mouse is released;

[0034] When dragging a quantum gate, you can refer to the circuit programming page and language programming rendering. Figure 2 , where the main editing code page reference Figure 3 ;

[0035] When executing the operation of deleting quantum gates in circuit programming, delete the quantum gates to be deleted in the array, then reassemble the new array and re-render the code in the QASM editor. For the rendering of circuit programming and language programming pages, refer to Figure 4 , the main editing code page reference Figure 5 ;

[0036] When inserting a new quantum gate, when dragging the quantum gate to move, you need to obtain the coordinates of the current position, obtain the coordinates of the position to be dragged and dropped, and then see if there is a quantum gate in the next column. If not, it will be placed as the last column. If there is another quantum gate behind it, find the corresponding position in the array and insert it, and then re-render the circuit and editor;

[0037] After the operation is completed, the storage array of the quantum gate can be re-divided by column. Each column becomes a new array. Then the array divided by column is put into the new array to form a new two-dimensional array. At this time, the array is traversed and the array is displayed in the QASM code format according to the format requirements. The QASM editor displays the page rendering when the QASM editor edits the code. Figure 6 , the main editing code page reference Figure 7 ,in Figure 7Where tq[θ] can be added manually.

[0038] The present invention also provides a quantum cloud platform front-end development system, including an editing module, a parsing module and a layout module.

[0039] While the editing module is programming the front-end page circuit, it edits the language programming to generate QASM code. The parsing module parses the QASM code into the front-end code. The layout module uses svg to render the front-end layout on the front-end page based on the front-end code.

[0040] The information interaction, execution process and other contents between the modules in the above-mentioned system are based on the same concept as the embodiment of the method of the present invention. For the specific contents, please refer to the description in the embodiment of the method of the present invention, and no further description is given here.

[0041] It should be noted that not all steps and modules in the above-mentioned processes and system structures are necessary, and some steps or modules can be ignored according to actual needs. The execution order of each step is not fixed and can be adjusted as needed. The system structure described in the above-mentioned embodiments can be a physical structure or a logical structure, that is, some modules may be implemented by the same physical entity, or some modules may be implemented by multiple physical entities, or some components in multiple independent devices may be implemented together.

[0042] The above-described embodiments are only preferred embodiments for fully illustrating the present invention, and the protection scope of the present invention is not limited thereto. Equivalent substitutions or changes made by those skilled in the art based on the present invention are within the protection scope of the present invention. The protection scope of the present invention shall be subject to the claims.

Claims

1. A quantum cloud platform front-end development method, characterized by While programming the front-end page circuit, Edit the language programming to generate QASM code, parse the QASM code into front-end code, use SVG to render the front-end layout on the front-end page, operate the quantum gate of circuit programming, re-divide the storage array of quantum gate, traverse the storage array, display the storage array in QASM code format, and use SVG to render the front-end layout. Change the QASM code through corresponding operations to modify the front-end page, and use SVG to render the front-end layout again: When performing the deletion operation, determine the QASM code of the quantum bit to be deleted in the language programming, delete the corresponding code, and re-render the front-end layout using SVG on the front-end page; When performing the insertion operation, determine the insertion position of the quantum bit, insert the corresponding QASM code in the language programming, re-parse the QASM code, obtain the front-end code, and re-use svg to render the front-end layout of the front-end page.

2. A quantum cloud platform front-end development system, characterized by Including editing module, parsing module and layout module, While the editing module is programming the circuit of the front-end page, it edits the language programming to generate QASM code. The parsing module parses the QASM code into the front-end code. The layout module uses SVG to render the front-end layout on the front-end page. The editing module operates the quantum gate of the circuit programming, re-divides the storage array of the quantum gate, traverses the storage array, and displays the storage array in the QASM code format. The layout module uses SVG to render the front-end layout. The editing module changes the QASM code through corresponding operations to modify the front-end page, and the layout module re-renders the front-end layout using SVG: When the editing module performs a deletion operation, it determines the QASM code of the quantum bit to be deleted in the language programming, deletes the corresponding code, and the layout module re-renders the front-end layout using SVG; When the editing module performs an insertion operation, it determines the insertion position of the quantum bit and inserts the corresponding QASM code in the language programming. The parsing module re-parses the QASM code to obtain the front-end code, and the layout module re-uses SVG to render the front-end layout of the front-end page.

Images