2012-11-04 3 views
1

내보기 중 하나에 html.erb 파일이 있습니다. 이 파일은 꽤 크고 약 2/3 자바 스크립트 코드와 단지 1/3 HTML을 가지고 있습니다. 나는이 파일이 너무 어수선하기는 것을 좋아하지 않는다. javascript 부분은 대부분 날짜 처리기, 페이지의 해당 html 요소에 대한 대화 상자 등의 jquery UI 구성 요소의 이벤트 핸들러 및 사용법입니다. HTML 부분에서 자바 스크립트 부분을 분리하고 싶습니다.html.erb 파일에서 눈에 잘 띄지 않는 javascript 이동

  1. javascript를 별도의 js.erb 파일로 이동하여 부분적으로 사용할 수 있습니까? 이것의 장점은 무엇입니까?

  2. I18n.() 및 < % = form_authenticity_token %>와 같은 레일 API를 사용하면 어떻게 자바 스크립트를 정적 .js 파일로 옮길 수 있습니까? 나는 자바 스크립트 함수를 매번 반복 할 때마다 그것을 전달해야 하는가? 이 작업을 수행하는 더 좋은 방법이 있습니까?

  3. javascript를 html.erb 파일 밖으로 이동하면 html.erb 페이지 캐싱/렌더링에 도움이됩니까? 어떤 재사용 가능한 패턴이 html.erb 파일에

    샘플 코드가있는 경우

관심

알아낼 :

<% content_for :javascript do %> 
<script type="text/javascript"> 

$(document).ready(function() 
{ 
    $('#create_segment_dialog').dialog({ 
      title: "<%= I18n.t("segment.create_segment_title") %>", 

    // lots of javascript 


} 

</script> 
<%end %> 

//HTML starts here 

<div id="right-column"> 

답변

3

내 2C,하지만 난 다른 의견에가 알고 this :

JS 코드를 함수 나 함수로 분리하여 애셋 파이프 라인의 JS 파일에 넣으십시오. 다른 방법/컨트롤러에서 사용할 수있는 재사용 가능한 구성 요소로 JS를 무너 뜨리는 움직임을 이용하십시오.

  • 캐싱을 & 당신의 JS 지문 자산
  • 축소에서는에게 & 압축 지원을 당황하게하는 대역폭
  • 축소에서는 저장 :

    이것은 당신이 이동 JS의 자산 파이프 라인의 모든 혜택을받을 의미 코드가 원하는 경우

  • JS 파일을 연결하여 브라우저의 요청 수를 줄이십시오.
  • 다른 위치에서 자산을 제공하기 위해3210
  • 가능성 (CDN, 웹 응용 프로그램 계층 대 계층)
  • 개선 건조하는 자바 스크립트는 다른 방법/컨트롤러

단점으로 사용하는 경우? 앞서 지적했듯이 모든 Rails 변수는 매개 변수로 함수에 전달되어야합니다.

JavaScript를 .js.erb partial로 이동하는 것은 옵션이지만이 코드가 특정 메소드 나 컨트롤러에 매우 특정한 경우 DRYness가 개선되지는 않습니다. 코드가 좀 더 읽기 쉽도록 만들 수 있습니다. HTML과 JS를 분리합니다.

+0

@ sfishfish이 답변을 귀하의 질문에 보내셨습니까? – mccannf

관련 문제