Browse Source

Merge branch 'feature-tianyong' into gym-dev

TIANYONG 3 months ago
parent
commit
a244bb53e0
5 changed files with 35 additions and 23 deletions
  1. 2 2
      src/helpers/calcSpeed.ts
  2. 12 10
      src/helpers/formateMusic.ts
  3. 0 1
      src/page-instrument/App.tsx
  4. 6 2
      src/state.ts
  5. 15 8
      src/view/music-score/index.tsx

+ 2 - 2
src/helpers/calcSpeed.ts

@@ -117,9 +117,9 @@ export type GradualItem = {
  */
 export const getGradualLengthByXml = (xml: string) => {
 	const firstPartXml = onlyVisible(xml, 0, 'calc')
-	console.time('DOMParser 耗时2')
+	//console.time('解析xml 耗时2')
 	const xmlParse = new DOMParser().parseFromString(firstPartXml, "text/xml");
-	console.timeEnd('DOMParser 耗时2')
+	//console.timeEnd('解析xml 耗时2')
 	const measures = Array.from(xmlParse.querySelectorAll("measure"));
 	const notes = Array.from(xmlParse.querySelectorAll("note"));
 	const words = Array.from(xmlParse.querySelectorAll("words"));

+ 12 - 10
src/helpers/formateMusic.ts

@@ -252,10 +252,10 @@ export const getCustomInfo = (xml: string): CustomInfo => {
 		showSpeed: true,
 		parsedXML: xml,
 	};
-	console.time('DOMParser 耗时3')
+	//console.time('解析xml 耗时3')
 	// const xmlParse = new DOMParser().parseFromString(xml, "text/xml");
 	const xmlParse = xmlDocRef.value ? xmlDocRef.value : new DOMParser().parseFromString(xml, "text/xml");
-	console.timeEnd('DOMParser 耗时3')
+	//console.timeEnd('解析xml 耗时3')
 	const words: any = xmlParse?.getElementsByTagName("words");
 	for (const word of words) {
 		if (word && word.textContent?.trim() === "隐藏速度") {
@@ -365,10 +365,10 @@ export const onlyVisible = (xml: string, partIndex: number, resourceType?: strin
 	if (!xml) return "";
 	// console.log('原始xml')
 	const detailId = state.examSongId + "";
-	console.time('DOMParser 耗时4')
+	//console.time('解析xml 耗时4')
 	// const xmlParse = new DOMParser().parseFromString(xml, "text/xml");
 	const xmlParse = xmlDocRef.value ? xmlDocRef.value : new DOMParser().parseFromString(xml, "text/xml");
-	console.timeEnd('DOMParser 耗时4')
+	//console.timeEnd('解析xml 耗时4')
 	const partList = xmlParse.getElementsByTagName("part-list")?.[0]?.getElementsByTagName("score-part") || [];
 	const partListNames = Array.from(partList).map((item) => item.getElementsByTagName("part-name")?.[0]?.textContent?.trim() || "");
 	const parts: any = xmlParse.getElementsByTagName("part");
@@ -531,6 +531,7 @@ export const onlyVisible = (xml: string, partIndex: number, resourceType?: strin
 		});
 	}
 	// console.log(xmlParse)
+	
 	return new XMLSerializer().serializeToString(appoggianceFormate(xmlParse));
 };
 
@@ -538,9 +539,9 @@ export const onlyVisible2 = (xml: string): string => {
 	if (!xml) return "";
 	// console.log('原始xml')
 	//const detailId = state.examSongId + "";
-	console.time('DOMParser 耗时5')
+	console.time('解析xml 耗时5')
 	const xmlParse = new DOMParser().parseFromString(xml, "text/xml");
-	console.timeEnd('DOMParser 耗时5')
+	console.timeEnd('解析xml 耗时5')
 	const partList = xmlParse.getElementsByTagName("part-list")?.[0]?.getElementsByTagName("score-part") || [];
 	//const partListNames = Array.from(partList).map((item) => item.getElementsByTagName("part-name")?.[0]?.textContent?.trim() || "");
 	//state.partListNames = partListNames;
@@ -633,9 +634,9 @@ export const formatZoom = (num = 1) => {
 /** 妙极客多分轨的曲子,可能没有part-name标签,需要手动加上该标签 */
 export const xmlAddPartName = (xml: string) => {
 	if (!xml) return "";
-	console.time('DOMParser 耗时6')
+	console.time('解析xml 耗时')
 	const xmlParse = new DOMParser().parseFromString(xml, "text/xml");
-	console.timeEnd('DOMParser 耗时6')
+	console.timeEnd('解析xml 耗时')
 	const scoreParts = Array.from(xmlParse.getElementsByTagName("score-part"));
 	for (const scorePart of scoreParts) {
 		if (scorePart.getElementsByTagName("part-name").length === 0) {
@@ -658,10 +659,10 @@ export const xmlAddPartName = (xml: string) => {
  */
 export const formatXML = (xml: string, xmlUrl?: string): string => {
 	if (!xml) return "";
-	console.time('DOMParser 耗时7')
+	//console.time('解析xml 耗时7')
 	// const xmlParse = new DOMParser().parseFromString(xml, "text/xml");
 	const xmlParse = xmlDocRef.value ? xmlDocRef.value : new DOMParser().parseFromString(xml, "text/xml");
-	console.timeEnd('DOMParser 耗时7')
+	//console.timeEnd('解析xml 耗时7')
 	// 声调
 	const fifths = xmlParse.getElementsByTagName("fifths");
 	if (fifths && fifths.length) {
@@ -817,6 +818,7 @@ export const formatXML = (xml: string, xmlUrl?: string): string => {
 			transferJianNote(measure, divisions, preBeats, preBeatType)
 		}
 	}
+	xmlDocRef.value = xmlParse;
 	return new XMLSerializer().serializeToString(xmlParse);
 };
 

+ 0 - 1
src/page-instrument/App.tsx

@@ -157,7 +157,6 @@ export default defineComponent({
         let diff = timing.domInteractive - timing.fetchStart;
         //console.log("TTI: " + diff);
         const timeInfo = [
-          { '类型': 'TTI', '耗时': diff},
           { '类型': 'DNS 解析耗时', '耗时': domainLookupEnd - domainLookupStart},
           { '类型': 'TCP 连接耗时', '耗时': connectEnd - connectStart},
           { '类型': 'SSL 安全连接耗时', '耗时': connectEnd - secureConnectionStart},

+ 6 - 2
src/state.ts

@@ -609,6 +609,8 @@ const state = reactive({
   firstMeasureNumber: 1,
   /** 是否是单声轨多声部的声轨 */
   isSingleMutliTrack: false,
+  /** 是否是来源于缓存的xml */
+  xmlFromStore: false,
 });
 const browserInfo = browser();
 let offset_duration = 0;
@@ -1476,10 +1478,12 @@ const queryMusicXml = async (id: string, xmlUr: string) => {
   const storeXmlData = await dbService.get(id).then((data) => data );
   if (storeXmlData && storeXmlData.xmlString) {
     xmlString = storeXmlData && storeXmlData.xmlString
+    state.xmlFromStore = true;
     console.timeEnd('缓存获取xml')
     // 使用完后删除数据
     dbService.delete(id)
   } else {
+    state.xmlFromStore = false;
     xmlString = await fetch(xmlUr).then((response) => response.text());
   }
   return xmlString;
@@ -1553,10 +1557,10 @@ const getMusicInfo = async (res: any) => {
 //获取xml中的音轨数据
 function xmlToTracks(xmlString: string) {
   //console.time('domparse')
-  console.time('DOMParser 耗时1')
+  // console.time('解析xml 耗时1')
   // const xmlParse = new DOMParser().parseFromString(xmlString, "text/xml");
   const xmlParse = xmlDocRef.value;
-  console.timeEnd('DOMParser 耗时1')
+  // console.timeEnd('解析xml 耗时1')
   //console.timeEnd('domparse')
   const partNames = xmlParse ? Array.from(xmlParse.getElementsByTagName('part-name')) : [];
   return partNames.reduce((arr: string[], item) => {

+ 15 - 8
src/view/music-score/index.tsx

@@ -76,15 +76,22 @@ export default defineComponent({
 			if(!downloadXmlStr.value){
 				downloadXmlStr.value = await fetch(state.xmlUrl).then((response) => response.text())
 			}
-			const xmlStr = downloadXmlStr.value;
-			console.time('解析重构xml')
-			const parseXmlInfo = getCustomInfo(xmlStr);
-			const xml = formatXML(parseXmlInfo.parsedXML);
-			musicData.score = state.isCombineRender ? xml : onlyVisible(xml, state.partIndex);
-			if (state.gradualTimes) {
-				state.gradual = getGradualLengthByXml(xml);
+			console.time('增删改查xml')
+			if (state.xmlFromStore) {
+				musicData.score = state.isCombineRender ? downloadXmlStr.value : onlyVisible(downloadXmlStr.value, state.partIndex);
+				if (state.gradualTimes) {
+					state.gradual = getGradualLengthByXml(downloadXmlStr.value);
+				}
+			} else {
+				const xmlStr = downloadXmlStr.value;
+				const parseXmlInfo = getCustomInfo(xmlStr);
+				const xml = formatXML(parseXmlInfo.parsedXML);
+				musicData.score = state.isCombineRender ? xml : onlyVisible(xml, state.partIndex);
+				if (state.gradualTimes) {
+					state.gradual = getGradualLengthByXml(xml);
+				}
 			}
-			console.timeEnd('解析重构xml')
+			console.timeEnd('增删改查xml')
 		};
 
 		const init = async () => {