[發明專利]一種基于手繪網頁圖像的前端工程化代碼生成方法

在審

• 申請號: 201911138941.0
• 申請日: 2019-11-20
• 公開（公告）號: CN110968299A
• 公開（公告）日: 2020-04-07
• 發明（設計）人: 陳子豪;賀國平;楊佳現;劉哲;劉宇豪
• 申請（專利權）人: 北京工業大學
• 主分類號: G06F8/33
• 分類號: G06F8/33;G06F8/35;G06F8/38;G06F16/958
• 代理公司: 北京思海天達知識產權代理有限公司 11203
• 代理人: 劉萍

1.一種基于手繪網頁圖像的前端工程化代碼生成方法，其特征在于，設計基于手繪網頁圖像的前端代碼自動生成算法Draft2Code，包含3個部分：

(1)建立視覺模型

在視覺模型的設計中，采用CNN非監督學習，將輸入圖像轉換為學習定長向量作為輸出；

將輸入圖像調整為256×256的彩色圖片，激活函數均為ReLU，并且只進行卷積，不對邊界做處理；首層的卷積核數目設定為16，第二層為32，第三層為64，最后一層為128；

經過四層卷積輸出向量p待后續處理；

(2)建立語言模型

引入LSTM的變體GRU來對長時間序列數據的關系進行建模，該模型由2層分別包含128個細胞的GRU神經網絡組成；

GRU中的新記憶h～是通過使用遞歸連接來學習記憶信息的，利用t時刻輸入的向量x_t和前一步驟中產生的輸出向量q_t-1經過權重相乘通過sigmoid函數激活，即根據公式z_t＝σ(W_z·[q_t-1,x_t])和r_t＝σ(W_r·[q_t-1,x_t])得到兩個門值，更新門權重z_t和重置門權重r_t；σ為激活函數sigmoid；在q_t-1與權重乘積之后和重置門r_t相乘，之后根據公式得到最終的新記憶其中W_z為隱藏層到更新門的權值矩陣，W_r為隱藏層到重置門的權值矩陣，W為隱藏層到待選狀態的權值矩陣；最后根據公式得到當前步驟的輸出向量q_t；

對于每個t時刻都會輸出向量q_t待后續處理；

(3)建立解碼器

視覺編碼向量p和t時刻的語言編碼向量q_t連接組成向量r_t，輸入到第二個基于GRU的解碼器模型中，該模型由2層分別包含512個細胞的GRU神經網絡組成，用于解碼此前通過視覺模型和語言模型學習得到的表現數據；

(4)訓練階段

模型使用監督學習的方法進行訓練；為了更好的平衡長期依賴和計算損耗，使用長度為48的滑動窗口對用于訓練的每個DSL輸入文件進行分割，得到特征序列；每個時刻都會輸入手繪圖像I和對應的特征序列x_t，輸出預測的下一個特征y_t；模型使用交叉熵代價函數作為其損失函數，它會將模型預測的下一個特征y_t和實際的下一個特征x_t+1進行比較；

當用于訓練的上下文在每個時刻通過滑動窗口進行更新時，對于與同一頁面樣式相關聯的樣本，將重用相同的輸入圖像I；最后設置兩種標記：<START>和<END>，分別作為DSL文件前綴和后綴的占位標志，以方便后續編譯時替換前后綴的具體內容；

訓練是通過計算損失相對于用反向傳播計算的網絡權重的偏導數來執行的，以最小化多分類對數損失，損失計算公式如下：

上述公式中，x_t+1為下一時刻的輸入向量，y_t是當前時刻的輸出向量；

用RMSProp即Root Mean Square Prop算法訓練，學習率設置為1×10^-4，并將輸出梯度限制在[-1.0，1.0]范圍內，以應對數值不穩定性；為了防止模型過擬合，引入了隨機失活正則化，對視覺模型的完全連接層后設置0.3的失活率，即在該層訓練中每次隨機刪除30％的神經元，使模型不太依賴某些局部特征，泛化性更強；

訓練方式采用每64組圖像序列為一批的小批量訓練；

訓練后建立圖像數據和用DSL代碼表示的相關特征序列之間關系模型；

(5)測試階段

為了生成DSL代碼，向上述Draft2Code模型中輸入手繪網頁圖像I和特征數為48的上下文序列X；將x_t...x_T-1初始化設置為空向量，序列的最后一個特征向量x_T設置為<START>；然后使用預測的特征向量y_t來更新下一個特征序列；也就是要將x_t...x_T-1分別設置為x_t+1...x_T，再將x_t設置為y_t；重復該過程，直到模型生成標記<END>；最后使用傳統編譯方法將生成的DSL特征序列編譯為所需的目標語言。