30

내 레일 어플리케이션 (모두 2.3.5)은 인라인 자바 스크립트, rjs, 프로토 타입 및 jquery의 총 혼합을 사용합니다. 그것을 배우거나 성장시키는 고통이라고 부르 자. 요즘 나는 눈에 거슬리는 자바 스크립트에 점점 더 몰두 해왔다. 그것은 CSS가 그것을 청소하는 것과 같은 방식으로, 귀하의 HTML을 깨끗하게합니다.레일스 베스트 프랙티스 어디에 눈에 잘 띄지 않는 자바 스크립트를 배치 하는가

은 그러나 내가 본 대부분의 예제는 작은 예, 그들은 지금은 꽤 큰 응용 프로그램을 가지고 있고, 난 내 JS를 구성하는 방법을 생각하고 application.js

내에서 모든 자바 스크립트 (jQuery를) 넣어. 어떻게 든 스크립트가 여전히 뷰에 가까운 것을 좋아, 그래서 내가 orders.js가보기에 고유 한 눈에 거슬리지 자바 스크립트가 포함되어

orders.html.erb 
orders.js 

같은 것을 생각하고있다. 하지만 어쩌면 그게 너무 보수적 인 것일 수도 있습니다.

나는이 문제와 관련하여 Yehuda Katz가이 문제에 대해 읽은 글 중 herehere입니다. 그것은 귀하의 js 파일을 통해 귀하의 견해와 관련된 것들을로드합니다. 그러나 아아 나는 현재 구현을 찾을 수 없다.

그래서 내 질문 :

  • 어떻게 당신에게 가장 좋은 구조 당신의 눈에 거슬리지 자바 스크립트를 할; 코드 관리, html에서 무엇이해야하는지 분명하게 알 수있는 방법은 무엇입니까? 좋은 클래스 이름이 먼 길을가는 것 같아요 :)
  • 어떻게 파일을 정렬하고 모두로드합니까? 몇 개? 보기에서 content_for :script 또는 javascript_include_tag을 사용하여 관련 스크립트를로드하십시오. 아니면 ...?
  • 매개 변수 (추가 속성 추가)와 함께 매우 일반적인 기능 (예 : 삭제)을 작성합니까, 매우 구체적인 기능 (DRY?)을 작성합니까? Rails 3에는 표준 세트가 있으며 모든 것이 눈에 잘 띄지 않습니다. 그러나 Rails 2.3.5부터 시작하는 방법은 무엇입니까?

간단히 말해 레일에서 눈에 잘 띄지 않는 자바 스크립트를 수행하는 가장 좋은 방법은 무엇입니까? :)

답변

10

하나의 모범 사례가 있다고 생각하지 않지만, 내가하는 일을 알려 드리겠습니다.

  1. 은 내가 public/javascripts/ 디렉토리에있는 자신의 목적을 위해 JS 파일을 각각의 시리즈가있다. 일부 예로는 utility.jschat.jsshopping_basket.js 등이 있습니다.

  2. 저는 asset packager을 사용하고 모든 일반적인 사용 기능과 관리자 전용 기능을위한 하나의 큰 뚱뚱한 모음을 정의합니다. 서버로의 왕복 비용은 너무 비쌉니다. 나는 기본적으로 하나의 blob (일반적으로)로 축소 된 첫 번째 페이지로드에 모든 js를 포함합니다.

  3. 기본 $(document).ready 후크를 페이지에 인라인으로 허용하고 실제로는 그만큼 짧게 유지합니다.

  4. 내 js 파일에서 액세스해야하는 데이터가 페이지와 인라인으로 렌더링됩니다. (보통 DOM에, 때때로로는 바르 - 예 var xyz = 100합니다.)

  5. 나는 보통 자바 스크립트 내 컨트롤러를 개발 (및 확인 모든 작품을), 나는이 켜 필요한 경우 몇 if request.xhr?을 뿌려 것입니다.


명심가, 철도 3.1이 내장 된 모범 사례를 소개, 참조 : http://guides.rubyonrails.org/asset_pipeline.html를 - 나는 새로운 파이프 라인의 성능 및 구성 문제가 있었다 개인적으로에, 그러나 많은 사람들이 큰 있었다 그것으로 성공.

+0

이것은 매우 흥미 롭습니다. 완료. 나는 아직도 다른 사람들이 말하는 것에 관심이있다. – nathanvda

3

나는 최근에 내가 얼마나 managing javascript in Ruby on Rails인지 문서화했다. 필자는 기본적으로 적절한 네임 스페이스가있는 많은 작고 세분화 된 파일로 구성한 다음 asset_packager를 사용하여 프로덕션을 위해 모두 단일 파일로 병합합니다.

+0

나는보기에 대한 컨트롤러와 같은 이름의 .js 파일을 자동으로로드하는 방법을 좋아합니다. 그게 적어도 좋은 시작 같습니다 :) – nathanvda

1

같은 문제를 해결하는 동안이 게시물을 발견했지만 기존 솔루션 중 아무 것도 올바른 답을 찾지 못했습니다. 내 접근 방식을 썼다 here. 레일스 컨벤션을 구성보다 좋아하기 때문에 특정 액션 페이지에만 적용 할 수있는 자바 스크립트를 포함하는 것과 동일한 접근 방식을 원했습니다. 다른 방법이 없다면 옵션에 추가하는 것이 적어도 다른 방법입니다.

+0

나는 당신의 제안을 정말 좋아하고, 그것은 내가 정말로 원했던 것에 매우 가깝습니다. 지금 내가하는 일은 어쨌든 컨트롤러 당 파일에서 js를 분리하는 것입니다. 그러나 하나의 큰 결합 된 js에서 더 빨리로드합니다 (개별 파일 톤 대신 1 개의 큰 js). – nathanvda