0
크롬 확장 프로그램을 개발 중입니다.부츠랩의 CSS 삽입이 페이지에 영향을 미침
단어를 두 번 클릭하면 show popover가 필요합니다. 따라서 부트 스트랩 팝업을 삽입합니다 :
"content_scripts": [
{
"matches": ["*://*/*"],
"js": ["3rdparty/jquery-3.2.1.min.js",
"3rdparty/bootstrap-3.3.7.min.js", ...],
"css": ["3rdparty/bootstrap-3.3.7.min.css"],
"run_at": "document_end"
}
]
그러나이 주입은 일부 페이지에 영향을줍니다. 일부 아티팩트가 나타날 수 있습니다.
어떻게 제대로 popovers를 삽입 할 수 있습니까?
*하세요 *와 ** 모든 ** 페이지 ('content_scripts'에 jQuery를로드하지 않습니다 당신이 ** 필요 ** 않는 한 당신의'성냥'). jQuery는 최소 85KB의 코드입니다. 이것은 모든 단일 페이지에 * 안장하는 데 상당한 부담이됩니다. 100 개의 탭이 열린 우리 중 누가 무엇입니까? 최소한 사용자가 내선 번호와 상호 작용할 수있게하는 데 필요한 최소값 만 주입하십시오. 그런 다음 사용자가 선택하도록 한 번 더 주입하십시오. 최소한의 부분은 최소한의 바닐라 자바 스크립트 이벤트 핸들러와 UI 요소 또는 2 개가 될 수 있어야합니다. – Makyen
@Makyen, 발언 해 주셔서 감사합니다! 지금은 최적화 단계가 아니지만이를 고려할 것입니다. 100 탭의 경우 오버 헤드는 8.5miB입니다 (제 확장을 위해서는 ~ 12miB가 정확해야합니다). 모든 탭에서 가져온 메모리와 비교하면 너무 많은가요? – MrPisarik
글쎄, 나는 일상적으로 20 개 이상의 창 (현재는 없음)에 700 개 이상의 탭이 있었고 현재 27 개의 확장이 현재 활성화되어 있고 다른 40 개는 현재 비활성화되어있는 경우가있었습니다. 따라서 모든 활성 확장이 코드를 무차별로로드하는 경우 1.5GiB가됩니다 (단순화 된 코드의 경우). 85 키 블록은 메모리와 각 URL에로드하는 데 필요한 추가 컴퓨팅 리소스를 포함하여 필요한 전체 리소스를 나타내는 척도 일뿐입니다. 일반적으로 모든 라이브러리는 페이지가 표시되기 전에로드해야하며 이는 브라우저가 얼마나 반응하는지 사용자의 인식에 영향을줍니다. – Makyen